[CSS]float Opcje

[cycofiasz]

Witam, mam kod

[HTML] pobierz, plaintext 
<div id="header">
  <div style="width: 300px; float: left;">
    <a href="index.php"><img src="resources/logo.gif" /></a>
  </div>
  <div style="width: 600px; float: left;">
    <a href="index.php"><img src="resources/logo.gif"/></a>
  </div>
 
</div>
[HTML] pobierz, plaintext 

I jak zrobić, by ten div o id header zmieniał swoją wysokość zależnie od zawartości? Wiem że zadziała jeśli jemu też nadam float: left, ale czy nie da się jakoś inaczej?

[_olo_1984]

height: auto;

[cycofiasz]

Nie działa

[hateman]

[HTML] pobierz, plaintext 
<div id="header">
  <div style="width: 300px; float: left;">
    <a href="index.php"><img src="resources/logo.gif" /></a>
  </div>
  <div style="width: 600px; float: left;">
    <a href="index.php"><img src="resources/logo.gif"/></a>
  </div>
<div style="clear: both;"></div>
</div>
[HTML] pobierz, plaintext 

[hiszpanespaniol]

jak zrobić, by ten div o id header zmieniał swoją wysokość zależnie od zawartości?

sposób działający we wszystkich czołowych przeglądarkach:

[HTML] pobierz, plaintext 
#header {
height: auto !important;
height: 1px;
min-height: 1px;
}
[HTML] pobierz, plaintext 

edit:
musisz dodać jeszcze to:

[HTML] pobierz, plaintext 
overflow: hidden;
[HTML] pobierz, plaintext 

Ten post edytował hiszpanespaniol 22.09.2008, 21:40:48

[cycofiasz]

Oczywiście na kochanym IE tylko nie działa

[hiszpanespaniol]

skoro pod ie nie działa, to dodaj kolejną definicję css:

[HTML] pobierz, plaintext 
* html #header {
	overflow: visible;
}
[HTML] pobierz, plaintext 

to jest dla ie6, bo pod 7 musi byc już dobrze.
mam nadzieję, że pomogłem

hateman też napisał coś o czym zapomniałem:

[HTML] pobierz, plaintext 
.clear {clear: both}
 
<div class="clear"><!-- --></div>
[HTML] pobierz, plaintext 

musisz dać taki div na samym końcu, niestety innej rady nie znam gdy się stosuje float. komentarz w środku jest po to, aby div miał zerową wysokość w ie. Tym div'em może być np stopka albo coś

pozdrawiam

Ten post edytował hiszpanespaniol 23.09.2008, 09:59:24

[hateman]

mój wcześniej podany sposób musi działać
sprawdzałem u siebie :]

Może chcesz jakiś inny efekt uzyskać?
Teraz dwa obrazki są obok siebie a "header" jest rozszerzony (tak jak chciałeś)