Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [html/css] dziwne odstepy dla li z elementem a - display:block
Forum PHP.pl > Forum > Po stronie przeglądarki
wewior
mam prosty kod
  1. <ul>
  2. <li><a href="index.html">Obuwie</a></li>
  3. <li><a href="index.html">Akcesoria</a></li>
  4. <li><a href="index.html">Obuwie</a></li>
  5. </ul>

i jesli ustawie display:block dla elementu a to robia mi sie dziwne odstepy w ramach li, ustawialem juz rozne paddingi i marginy ale nie moge przyjsc na to co powoduje ten problem...
vokiel
może skombinuj tak:

  1. line-height: 25px;
  2. height: 25px;


*dane liczbowe przykładowe smile.gif
wewior
myslalem o tym ale nawet jesli bedzie dzialalo to nie chce tak bo dane w linkach beda ladowane z cmsa i moga miec rozna dlugosc, wiec moga byc tez w dwoch wierszach a wtedy bedzie kicha jesli ustawie wysokosc
vokiel
A samo line-height ?
Wtedy nie bedzie ustalonej na stałe wysokości i jeśli się treść nie zmieści w jednej linii to przenisie do następnej, ale 2, czy 3 linie będą możliwe...
wewior
ale samo line-height nic nie daje
zapomnialem dodac ze taki efekt jest tylko w ie (testowalem w wersji 6 nie wiem jak w innych) w pozostalych przegladarkach jest ok
Kreton
IE tutaj błędnie interpretuje białe znaki, o dziwo znak końca linii wywołuje dodanie nowej linii.
To będzie wyświetlanie zgodnie z oczekiwaniem:
Kod
<ul>
    <li><a href="index.html">Obuwie</a></li><li><a href="index.html">Akcesoria</a></li><li><a href="index.html">Obuwie</a></li>
</ul>

Problem jest tylko nieczytelność, można to też obejść inaczej, nadać :
Kod
* html ul li {
    height: 1%;
}

Albo dodajesz w Conditional comments dla IE.
wewior
wielkie dzieki Kreton na to bym nie wpadl, ze biale znaki w przypadku li te robia takie problemy, jeszcze raz dzieki za pomoc
Kreton
W przypadku samego li nie. Pewnie tylko wtedy gdy wewnątrz znajduje się element blokowy, ale głowy nie dam sobie uciąć bo nie testowałem innych kombinacji.
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.