Witam
Mam nastepujacy problem.
Projekt ktory zrobilem ma w glownym divie zdefioniowane cale, powtarzalne tlo skladajace sie z obramowania, i niebieskich paskow pod menu
http://www.zsi.slupsk.pl/test//screen_ie_good
O ile w IE calosc rozciaga sie dobrze, to w firefoxie tla w ogole nie widac
http://www.zsi.slupsk.pl/test//screen_ff_bad
natomiast gdy definiuje height w pikselach na dole miedzy stopka a zawartoscia tworzy sie irytujacy odstep
Probowalem chyba wszystkiego, bawilem sie overflowem, position, i dodatkowymi divami pod tlem.
Od kilku dni wyrywam sobie wlosy z glowy na tym projekcie, jesli ktos wie jak na to zaradzic, z gory dziekuje za pomoc
Aha, calosc jest na div'ach, tabelki nie wchodza w gre
Pozdrawiam
[CSS] height
Moderator: Pomocy?!
Posty: 6
• Strona 1 z 1
[CSS] height
autor: PinS » 05 sierpnia 2006, 15:36
Przeglądarka: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1)
- PinS
autor: Gość » 06 sierpnia 2006, 11:59
Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 5.1; pl; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Właśnie. Nie ma kodu. Nie mniej wypróbuj poniższy CSS, może akurat to rozwiąże problem:
- Kod: Zaznacz cały
html, body {
height: 100%;
}
- Gość
autor: PinS » 06 sierpnia 2006, 16:38
Przeglądarka: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1)
Kod, wlasnie, juz podaje.
xhtml 1.0 strict
Co do css, jak widac probowalem all sztuczek z min-height i hackow
Wszystkie wartosci z height i min-height byly zmieniane po tysiac razy, probowalem wszystkiego, bez rezultatu. To wyglada tak jakby div znahdujacy sie nizej w hierarchii niz #start blokowal mozliwosc jego wydluzania oraz tla zdefiniowanego dla #start.
Ale to tylko przypuszczenia.
Gdzies slyszalem, ze mozna to jakos zrobic w js, ale tu sie moja wiedza na ten temat konczy. Moze Wy cos wiecie na ten temat ?.
Dzieki za re, pozdro
xhtml 1.0 strict
Co do css, jak widac probowalem all sztuczek z min-height i hackow
- Kod: Zaznacz cały
html, body {
margin: 0;
padding: 0;
height: 101%;
min-height: 440px;;
width: 100%;
background: url(images/bg.jpg);
}
#start {
margin: 0 auto; background: url(images/main_bg.jpg) repeat-y; width: 765px; height: 440px;; position: relative;
}
html>body #start {
margin: 0 auto; background: url(images/main_bg.jpg) repeat-y; width: 765px;
position: relative;
height: 720px;;
min-height: 720px;;
padding-bottom: 0px;
}
Wszystkie wartosci z height i min-height byly zmieniane po tysiac razy, probowalem wszystkiego, bez rezultatu. To wyglada tak jakby div znahdujacy sie nizej w hierarchii niz #start blokowal mozliwosc jego wydluzania oraz tla zdefiniowanego dla #start.
Ale to tylko przypuszczenia.
Gdzies slyszalem, ze mozna to jakos zrobic w js, ale tu sie moja wiedza na ten temat konczy. Moze Wy cos wiecie na ten temat ?.
Dzieki za re, pozdro
- PinS
autor: JBG » 06 sierpnia 2006, 19:49
Przeglądarka: Mozilla/5.0 (Windows; U; Windows NT 5.1; pl; rv:1.8.0.6) Gecko/20060728 Firefox/1.5.0.6
Nieco, moim zdaniem, namieszałeś w css, jak rozumiem chciałeś podawać wartości dla IE i innych przeglądarek. Zamiast tego, to co masz podać dla IE, zastosuj komentarz warunkowy dla drugiego stylu. Poza tym, wartość position: relative jest wartością domyślną i o ile nie stosujesz dalej position:absolute, nie widzę sensu, by to pisać
Ponadto jest css, ale brak kodu html, to też przypomina wróżenie ze szklanej kuli, niemniej jednak proponowałbym zastosować taki kod html:
oraz css do tego
PinS pisze:
Co do css, jak widac probowalem all sztuczek z min-height i hackow
- Kod: Zaznacz cały
html, body {
margin: 0;
padding: 0;
height: 101%; <---- np. tutaj
min-height: 440px;; <---- i tutaj
width: 100%;
background: url(images/bg.jpg);
}
#start {
margin: 0 auto; background: url(images/main_bg.jpg) repeat-y; width: 765px; height: 440px;; position: relative;
}
html>body #start {
margin: 0 auto; background: url(images/main_bg.jpg) repeat-y; width: 765px;
position: relative;
height: 720px;; <---- np. tutaj
min-height: 720px;; <---- i tutaj
padding-bottom: 0px;
}
Ponadto jest css, ale brak kodu html, to też przypomina wróżenie ze szklanej kuli, niemniej jednak proponowałbym zastosować taki kod html:
- Kod: Zaznacz cały
<html>
<head>
</head>
<body>
<div id="blok">
<div id="glowny">
<div id="tresc">
</div>
<div id="clear"></div>
</div>
<div id="stopka">
</div>
</div>
</body>
</html>
oraz css do tego
- Kod: Zaznacz cały
body {
margin: 0;
text-align: center;
background: url(pierwsze tło);
}
#blok {
width: 765px;
margin: 0 auto;
}
#glowny {
width: 100%;
min-height: 440px;
background: url(drugie tło.ramki)
}
#tresc {
width: żądana szerokość !important;
background: url(trzecie tło)
}
#clear {
clear: both;
width: 100%;
}
Szaleniec nie jest człowiekiem, który utracił rozsądek. Szaleniec utracił wszystko, poza rozsądkiem.
- JBG
- Posty: 142
- Z nami od: 17 marca 2005, 12:57
- Lokalizacja: Dobre Miasto
, sprawdze to
Posty: 6
• Strona 1 z 1
Kto jest online
Zarejestrowani użytkownicy: Baidu [Spider], Google [Bot]