 [HTML][CSS]Czemu w <li> robi się margines, jak zaradzić? |
| [HTML][CSS]Czemu w <li> robi się margines, jak zaradzić? |
Post
#1
|
|
|
Grupa: Zarejestrowani Postów: 9 Pomógł: 0 Dołączył: 23.09.2008 Ostrzeżenie: (0%) 
 |
Cześć. Mam taki kod:
Kod <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>TEST</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> ol {background: #aaa; list-style-type: none; text-align: center; padding: 0; } ol li {background: #777; display: inline; padding: .5em; } </style> </head> <body> <ol> <li>Jeden</li> <li>Dwa</li> <li>Trzy</li> <li>Cztery</li> <li>Pięć</li> <li>Sześć</li> </ol> </body> </html> Pytanie:
Ten post edytował mex 26.10.2008, 12:46:41 |
 |
 
|
 |
|
Post
#2
|
|
|
Grupa: Przyjaciele php.pl Postów: 1 202 Pomógł: 117 Dołączył: 13.04.2007 Skąd: 127.0.0.1 Ostrzeżenie: (0%)
|
Witaj!
Sformatuj proszę swój kod. Na chwilę obecną jest strasznie nieczytelny. Chcesz pomocy - szanuj czas innych! Pozdrawiam! edit: Byłeś szybszy (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg) Zamiast display: inline spróbuj float: left; Żeby wyśrodkować powinno wystarczyć margin: auto; dla ol |
|
|
|
|
Post
#3
|
|
|
Grupa: Zarejestrowani Postów: 9 Pomógł: 0 Dołączył: 23.09.2008 Ostrzeżenie: (0%)
|
Problem w tym, że nie wystarczy. Nawet jak dam dla <ol> width: 100%.
|
|
|
|
|
Post
#4
|
|
|
Grupa: Zarejestrowani Postów: 26 Pomógł: 8 Dołączył: 15.10.2008 Skąd: Wrocław Ostrzeżenie: (0%)
|
|
|
|
|
|
Post
#5
|
|
|
Grupa: Zarejestrowani Postów: 9 Pomógł: 0 Dołączył: 23.09.2008 Ostrzeżenie: (0%)
|
Działa. Powiedz mi, czemu tak się dzieje? Może to wina edytora. Korzystam z notepada2. Wg. tego co piszesz to kod powinien wyglądać tak:
Kod <ol> <li>Jeden</li><li>Dwa</li><li>Trzy</li><li>Cztery</li><li>Pięć</li><li>Sześć</li> </ol> Troche to dla mnie bez sensu. Czym to jest spowodowane? Ten post edytował mex 26.10.2008, 12:59:05 |
|
|
|
|
Post
#6
|
|
|
Grupa: Zarejestrowani Postów: 1 387 Pomógł: 273 Dołączył: 18.02.2008 Ostrzeżenie: (0%)
|
A konkretnie, spacje i znaki nowej linii. Elementy wyświetlane inline tak mają. Innym rozwiązaniem jest ustawienie dla li float: left i display:block, ale w tym wypadku zepsuje to efekt, który chcesz osiągnąć.
Ten post edytował l0ud 26.10.2008, 12:59:48 |
|
|
|
|
Post
#7
|
|
|
Grupa: Zarejestrowani Postów: 9 Pomógł: 0 Dołączył: 23.09.2008 Ostrzeżenie: (0%)
|
Oto drugi problem.
Kod <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>TEST</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> html body {margin: 0; padding: 0;} ol {background: #aaa; list-style-type: none; text-align: center; margin: 0; padding: 0; } ol li {background: #777; display: inline; padding: .5em; } </style> </head> <body> <ol> <li>Jeden</li><li>Dwa</li><li>Trzy</li><li>Cztery</li><li>Pięć</li><li>Sześć</li></ol> </body> </html> Jak należy zrobić by <li> mimo zwiększenia/zmniejszenia padding były na równo z górną listwą przeglądarki. Chciałbym by górna krawędź <li> pokrywała się np. z górną krawędzią <ol> przy okazji by <ol> dopasowywało swą wysokość do wysokości <li> |
|
|
|
 |
|
Aktualny czas: 26.09.2025 - 10:37 |
