✔ Div positionieren - wie?

[Hektik]

Hallo!

Ich habe einen DIV

#haupt {
position: relative;
margin: 30px auto;
width: 780px;
height: 500px;
background: #fff;
}

und einen zweiten

#footer {
font: 10px/16px verdana, tahoma;
color: #fff;
text-align: right;
text-valign: middle;
padding-right: 10px;
height: 18px;
position: absolute;
left: 2px;
right: 2px;
bottom: 2px;
background: #88A6FF;
margin: 2px solid #fff;
}

Sinn der Sache ist, dass der zweite DIV unten im ersten DIV liegt und die volle Breite bis auf 2px rechts, links und unten ausnutzt.

Mit dem obigen Code klappt das in Opera und FF ganz gut aber der ie macht den DIV nur so breit, wieviel Text enthalten ist.

mit

width: 100%;
und
width: 776px;

hab ich es versucht, dann gehts im IE, aber die anderen Browser spinnen rum und verschieben den über den rechten Rand hinaus.

Ich weiß nicht mehr weiter, Rat hab ich hier gesucht, auf de.selfhtml.org und css4you.de, aber nichts funktionierendes gefunden.

Weiß hier jemand Rat?

 

[Maik]

Für den IE muß in diesem Fall mal wieder eine Extra-Wurst gebraten werden

#haupt {
position: relative;
margin: 30px auto;
width: 780px;
height: 500px;
background: #fff;
border: 1px solid #000;
}

#footer {
font: 10px/16px verdana, tahoma;
color: #fff;
text-align: right;
text-valign: middle;
padding-right: 10px;
height: 18px;
position: absolute;
left: 2px;
right: 2px;
bottom: 2px;
background: #88A6FF;
margin: 2px solid #fff;
}

* html #footer { /* Für IE */
width: 766px;
}

 

[Hektik]

Kannst du mir auch den Sinn von

* html #footer { /* Für IE */
width: 766px;
}

erklären? Damit ich es auch versteh, warum?
Warum beginnt das z.B. mit einem * ?

 

[Maik]

Hierbei handelt es sich um den Star-HTML-Hack, der als CSS-Browserweiche für den IE fungiert und so Fehlerkorrekturen für den IE ermöglicht.

 

[Hektik]

Hierbei handelt es sich um den Star-HTML-Hack, der als CSS-Browserweiche für den IE fungiert und so Fehlerkorrekturen für den IE ermöglicht.

Also kann ich mit * html dann immer Attribute nur für den IE bestimmen? Hab ich das richtig verstanden?

Und: Danke, deine Lösung funktioniert

 

[Maik]

Korrekt

Anstelle der nachfolgenden ID kann auch eine CSS-Klasse oder ein HTML-Element notiert werden.

* html #content { }

* html .content { }

* html p { }