Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> problem z odstępami dla a
Jarod
post 6.09.2006, 17:52:23
Post #1





Grupa: Zarejestrowani
Postów: 1 190
Pomógł: 27
Dołączył: 23.04.2005

Ostrzeżenie: (0%)
-----


Natrafiłem na dość dziwne zachowanie przeglądarek.

Mam taki kod HTML:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" lang="pl" xml:lang="pl">
  3.  
  4. <head>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
  6. <meta http-equiv="Content-language" content="pl" />
  7. <link rel="stylesheet" href="css/lhc.css" type="text/css" />
  8. </head>
  9.  
  10. <body>
  11.  
  12. <div id="kontener">
  13. <div class="panel"><a href="#">To jest jakiś większy blok z tesktem 1
  14. To jest jakś większy blok z tesktem 1
  15. To jest jakś większy blok z tesktem 1
  16. To jest jakś większy blok z tesktem 1
  17. To jest jakś większy blok z tesktem 1
  18. To jest jakś większy blok z tesktem 1
  19. To jest jakś większy blok z tesktem 1
  20. </a></div>
  21.  
  22. <div class="panel"><a href="#">To jest jakś większy blok z tesktem 2
  23. To jest jakś większy blok z tesktem 2
  24. To jest jakś większy blok z tesktem 2
  25. To jest jakś większy blok z tesktem 2
  26. To jest jakś większy blok z tesktem 2
  27. To jest jakś większy blok z tesktem 2
  28. To jest jakś większy blok z tesktem 2
  29. To jest jakś większy blok z tesktem 2
  30. To jest jakś większy blok z tesktem 2
  31. </a></div>
  32.  
  33. </div>
  34.  
  35. </body>
  36. </html>


i CSS:
  1. * {
  2. margin: 0 auto;
  3. padding: 0;
  4. font-family: Verdana, Arial, Helvetica, sans-serif;
  5. }
  6. div#kontener {
  7. margin: 0 auto;
  8. width: 700px;
  9. color: black;
  10. background-color: red;
  11. overflow: auto;
  12. }
  13. .panel a {
  14. margin: 10px 0 20px 20px;
  15. padding: 3px 0 3px 5px;
  16. width: 300px;
  17. color: black;
  18. background-color: green;
  19. border: 1px #C6000C solid;
  20. text-decoration: none;
  21. clear: both;
  22. float: left;
  23. }
  24.  
  25. .panel a:hover {
  26. color: #B83C36;
  27. background-color: yellow;
  28. }



Wszystko ładnie pięknie. Ale jak usunę ze znacznika .panel a właściwości: clear: both; float: left; to wszystko się pier***. Dzięje się tak jeśli blok 1 i blok 2 są linkami.

Może mi ktoś wytłumaczyć dlaczego te dwa elementy muszą pływać jeśli chcę zastosować linki?

Prośba do moderatora o przesunięcie do działu CSS.

Ten post edytował J4r0d 6.09.2006, 18:18:32


--------------------
”Godzina nauki w życiu nowoczesnego apostoła jest godziną modlitwy.”
(św. Josemaría Escrivá, Droga, 335)
Go to the top of the page
+Quote Post
s_w_ir
post 6.09.2006, 20:09:42
Post #2





Grupa: Zarejestrowani
Postów: 315
Pomógł: 1
Dołączył: 6.08.2003
Skąd: Kielce

Ostrzeżenie: (0%)
-----


Kod
display: block;
zamiast clear i float. Jak sie dowiem to potem ewentualna odpowiedź dlaczego.


edit.
Zamiast robić operacje width padding margin na <a> rób to na divie. <a> jest od stylu textu, nie od wyglądu bloku.

Ten post edytował s_w_ir 6.09.2006, 20:27:13
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 16.06.2025 - 23:47