Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS] wyrównanie divów w pionie
Forum PHP.pl > Forum > Przedszkole
@rtur
mam taki layout oparty na divach i w firefoxie 3 i w operze efekt wyrównania długości divów right i left (Faux Columns) działa, a w ie7 nie chce, co zrobic aby ten layout wygladal tak samo w IE również.
  1. <div id='page'>
  2. <div id='top'></div>
  3. <div id='wraper'>
  4. <div id='right'></div>
  5. <div id='left'></div>
  6. <br style='clear: both;' />
  7. </div>
  8. <div id='stopka'></div>
  9. </div>


  1. #page{
  2. width: 860px;
  3. margin: 0px auto;
  4. padding: 0px;
  5. }
  6. #top{
  7. background: url(img/head.jpg);
  8. width: 860px;
  9. height:271px;
  10. }
  11. #left{
  12. width: 196px;
  13. float: left;
  14. background: #e0dcbf;
  15. padding: 2px;
  16. }
  17. #right{
  18. float: right;
  19. width: 600px;
  20. padding: 10px;
  21. background: white;
  22. }
  23. #wraper{
  24. background: url(img/wrapbg.png) repeat-y;
  25. margin-left: 20px;
  26. margin-right: 20px;
  27. }
  28.  
  29. #stopka{
  30. background: url(img/stopka.jpg);
  31. margin-left: 20px;
  32. margin-right: 20px;
  33. height: 40px;
  34. width: 820px;
  35. clear: both;
  36. }
PawelC
Dla IE musisz robić tak:
  1. *width:100px;

Z tą gwiazdą, a dla FF bez tej gwiazdki.
Np.:
  1. .klasa{
  2. width:100px; //dla FF
  3. *width:80px; //dla IE
  4. }

Aha i szerokość np 200px nie wygląda tak samo pod IE i FF, dlatego musisz podawać w IE mniejsze wartości niż dla FF. Tak samo jest z padding, margin etc..
@rtur
Nic to nie dało dodałem wszedzie gdzie mam atrybut width kolejny *width i nic sad.gif

Cytat
Aha i szerokość np 200px nie wygląda tak samo pod IE i FF, dlatego musisz podawać w IE mniejsze wartości niż dla FF.

A o tym nie wiedziałem, o ile mniejsze podawac dla IE?

acha a ja podawałem
Kod
#page{
  *width: 860px;
  width: 860px;
  margin: 0px auto;
  padding: 0px;
}


czy kolejnosc ma tu znaczenie?
PawelC
To zależy, sam musisz sprawdzać na bieżąco.
Cytat
Nic to nie dało dodałem wszedzie gdzie mam atrybut width kolejny *width i nic sad.gif

Z tą szerokością width to był tylko przykład.

I robisz to tak:
  1. width:200px;
  2. *width:180px;

A nie np:
  1. width:200px;
  2. height:50px;
  3. *width:180px;

Bo to nie zadziała!


# to źle podawałeś, pisałem dla IE mniejsze wartości się podaje.
mls
Cytat(ExPlOiT @ 1.04.2009, 11:32:18 ) *
# to źle podawałeś, pisałem dla IE mniejsze wartości się podaje.


Polecam poczytać o czymś takim jak box model i o jego zachowaniu w IE. Wystarczy odpowiednie doctype i brak prologu xml aby IE zaczął prawidłowo odtwarzać box model, tak jak inne przeglądarki.

--
Zostałem ostatnio zjechany tu na forum własnie za nieznajomość tematu box model, dlatego sobie poczytałem i teraz będę pouczał tongue.gif
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.