Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML/CSS] float i wysokość marginesu w Chrome
Forum PHP.pl > Forum > Po stronie przeglądarki > HTML \ XHTML
wujek_bogdan
Strona dostępna jest pod adresem krynica.8p.pl. W zasadzie wszystko jest OK, ale nurtuje mnie kwestia wielkości marginesu pomiędzy <div id="modernbricksmenu2"> a <div id="content">

We wszystkich przeglądarkach jest OK, poza Chrome. Tam margines musiałem dodać "sztucznie" za pomocą  <br style="clear: left;">
W Chrome (i pewnie w innych przeglądarkach na webkicie też) odstęp pomiędzy elementami jest ignorowany.
W gruncie rzeczy nie wygląda to źle, nie razi w oczy itd... ale chciałbym żeby strona w każdej przeglądarce wyglądała tak samo. Nie mam akurat IE6 pod ręką, ale nim się zajmę później dodając osobny styl CSS dla IE6.

Podejrzewam, że problem jest z elementami menu z atrybutem float.
//edit:
dodaję link do screena: click
singles
Spróbuj wywalić ten <br> z clear, a #content nadaj po ludzku większy margines górny:
Kod
#content {
margin: 15px 10px 10px;
}

Nie wiem po co tam ten clear był potrzebny.
wujek_bogdan
no właśnie na tym polega mój problem, że nie mogę nadać marginesów po ludzku, bo wtedy w chrome dzieją się jaja.
<br> jest potrzebny (albo jakikolwiek element blokowy). a co do clear, to rzeczywiście nie trzeba go dawać. wystarcz "goły" <br>.
dodawałem clear, ze względu na wcześniejsze float w <ul>.

gdy ustawię tak jak piszesz, to we wszystkich przeglądarkach jest OK, natomiast w chrome jest tak:



chce się pozbyć tego <br> bo wygląda to niezbyt elegancko winksmiley.jpg
gcdreak
U mnie jest elegencko.
singles
Eh, myślałem że rozpatrzyłeś jedną z najbardziej oczywistych rozwiązań - a chyba jednak nie :]
Oto one:
1. nadaj #modernbricksmenu2 stały height, np 30px. margin-top dla #content wtedy jest niepotrzebny.
2. nadaj #modernbricksmenu2 overflow : auto aby div rozszerzał się w pionie w zależności od tego co nim siedzi - w Twoim wypadku blokowe linki. margin-top dla #content daj wtedy odpowiedni.

Cytat
gdy ustawię tak jak piszesz, to we wszystkich przeglądarkach jest OK, natomiast w chrome jest tak:

Patrz punkt 2.

W przedstawionych obu wersjach u mnie na Operze, FF, Chrome, Safari i IE8 jest OK.
wujek_bogdan
@gcdreak
u ciebie jest elegancko, bo screena wrzuciłem z innej wersji niż leży na serwerze winksmiley.jpg

@singles
sprawdzę twoje propozycje.

//edit: wszystko gra. THX.
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.