[CSS][HTML]Padding w menu

[CSS][HTML]Padding w menu, Padding w menu

Bellum Zobacz profil	5.04.2011, 15:50:55 Post #1
Grupa: Zarejestrowani Postów: 28 Pomógł: 0 Dołączył: 2.03.2010 Skąd: ta pewność? Ostrzeżenie: (0%)	Witam, w praktyce stosuję takie oto rozwiązanie, jeżeli chcę nadać odpowiedni odstęp od krawędzi komórki np: tekstowi po 5px z każdej strony, to muszę zastosować zagnieżdżenie diwów w którym jeden z nich ma z góry określony rozmiar. Bez takiego rozwiązania zamiast odstępu tekstu mamy efekt uboczny w stylu powiększenia się również diva... Przykład: 1: <article> 2: <secton> zagnieżdżenie i wszystko działa cacy, tekst ma odpowiedni odstęp a komórka zachowała pierwotny rozmiar. Teraz ciemna strona mocy kodowania... chciałem nadać paddnig w menu, cóż kombinuję już od godziny co by tu zrobić aby ul a:link, ul a:visited po nadaniu padding rozmieścił odnośniki w zakresie z góry założonemu rozmiarowi komórki, jak na przykładzie artykułu. Może mam sklerozę albo nie pamiętam co źle robię. [HTML] pobierz, plaintext <!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>H5</title> <link rel="stylesheet" href="firefox.css" /> </head> <body> <header> Header </header> <nav> <section class="s2"> <ul> <li><a href="http://">link</a></li> <li><a href="http://">link</a></li> <li><a href="http://">link</a></li> <li><a href="http://">link</a></li> <li><a href="http://">link</a></li> </ul> </section> </nav> <article> <section class="s3"> ART W SECTION </section> </article> <footer>FOOTER</footer> </body> </html> [HTML] pobierz, plaintext i css [HTML] pobierz, plaintext html, body {background: #FFFFFF; margin: 0 auto; width: 960px;} article, footer, header, nav, aside {display: block;} nav {float: left; width: 200px; background: #ccc; margin-right: 10px;} .s2 ul, ul li { display: block; list-style: none; margin: 0; padding: 0;} .s2 ul { width: 200px;} .s2 ul a:link, ul a:visited { display: block; width: 200px; text-decoration: none; background-color: #ccceee; color: #000; padding: 5px;} article {float: left; width: 750px; background: #ccc;} .s3 {padding: 5px;} footer {clear: both;} [HTML] pobierz, plaintext Ten post edytował Bellum 5.04.2011, 16:00:08

Odpowiedzi

webfreak Zobacz profil	5.04.2011, 18:15:39 Post #2
Grupa: Zarejestrowani Postów: 77 Pomógł: 8 Dołączył: 29.03.2011 Skąd: Londyn Ostrzeżenie: (0%)	Cytat(melior @ 5.04.2011, 15:59:52 ) Powiem Ci tak: margin + padding + width = constant Innymi słowy, jeżeli chcesz zwiększyć margin, lub padding, ale zachować width stałe to musisz go zmniejszyć o tyle ile zwiększył łącznie te dwa pierwsze. jeslu uzywasz margin to rozmiar się nie zwiększa więc nie musisz go pomniejszać o wartość margin natomiast wartosc padding odejmujesz od wartosci width