div height=100% |
div height=100% |
27.09.2012, 09:18:52
Post
#1
|
|
Grupa: Zarejestrowani Postów: 173 Pomógł: 1 Dołączył: 26.10.2005 Skąd: Toruń Ostrzeżenie: (0%) |
witam, jakiś czas temu przestawilem sie z <table> na <div> budując layout strony, i nawet mi się to spodobało, jednak ostatnio trafilem na problem.
chcąc żyć w zgodzie z W3C, i jednocześnie mieć pewność że moja witryna poprawnie wyświetla się na wszystkich przeglądarkach zacząłem używać na główka <DOCTYPE> w wersji STRICT zamiast wczesniejszego TRANSITIONAL. używając TRANSITIONAL moja strona wyświetlała się poprawnie w najnowszych FF, Safari, Chrome i Operze, ale chrzanila sie przy IE 10, poprzestaiweniu, IE zaczelo wyswietlac poprawnie, a pozostale przeglądarki się sypnęły. problemem jest wysykość <div> poglądowy kod: w cssie klasa d1 ma wartości następujące: .d1 { width:100%; height:100%; } no i div rozciąga mi się na całą szerokość ekranu, niestety wysokość jest taka, jak wysokość elementu zawartego w jego wnętrzu. czyli w tym wypadku domyślna wysokość tekstu "aaa". Za chiny ludowe div nie chce mi się rozciągnąć na całą wysokość okna przeglądarki... co jest nie tak? jak przy doctype strict zmusić div do rozciągnięcia się na całą stronę, od brzegu do brzegu? |
|
|
27.09.2012, 09:23:31
Post
#2
|
|
Grupa: Zarejestrowani Postów: 55 Pomógł: 9 Dołączył: 7.04.2011 Ostrzeżenie: (0%) |
ja to robię za pomocą jQuery:
$('div.d1').css('height', $(window).height()); |
|
|
27.09.2012, 09:23:36
Post
#3
|
|
Grupa: Zarejestrowani Postów: 51 Pomógł: 13 Dołączył: 8.09.2012 Ostrzeżenie: (0%) |
Musisz ustawić wysokość rodzica. Body,html np na 100%
|
|
|
27.09.2012, 09:31:57
Post
#4
|
|
Grupa: Zarejestrowani Postów: 4 298 Pomógł: 447 Dołączył: 16.11.2006 Ostrzeżenie: (0%) |
bez display table się nie obejdzie. http://jsfiddle.net/HEjYd/
-------------------- Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta). |
|
|
27.09.2012, 09:44:43
Post
#5
|
|
Grupa: Zarejestrowani Postów: 173 Pomógł: 1 Dołączył: 26.10.2005 Skąd: Toruń Ostrzeżenie: (0%) |
no i bingo!
faktycznie html, body {height:100%} i display:table; pomoglo, dzięki!! |
|
|
27.09.2012, 10:06:42
Post
#6
|
|
Grupa: Zarejestrowani Postów: 2 355 Pomógł: 533 Dołączył: 15.01.2010 Skąd: Bydgoszcz Ostrzeżenie: (0%) |
Bez display: table też można:
http://jsfiddle.net/HEjYd/3/ |
|
|
27.09.2012, 12:24:52
Post
#7
|
|
Grupa: Zarejestrowani Postów: 4 298 Pomógł: 447 Dołączył: 16.11.2006 Ostrzeżenie: (0%) |
Bez display: table też można: http://jsfiddle.net/HEjYd/3/ Tak, ale wtedy pojawia się scroll i 1px umyka w wypadku obramowania. -------------------- Nie udzielam pomocy poprzez PW i nie mam GG.
Niektóre języki programowania, na przykład C# są znane z niezwykłej przenośności (kompatybilność ze wszystkimi wersjami Visty jest wiele warta). |
|
|
Wersja Lo-Fi | Aktualny czas: 10.06.2024 - 12:59 |