ugrás a tartalomhoz

Keret beállítása ul-nek CSS-sel

PogiG · 2006. Már. 12. (V), 09.30
Üdv!

Egy apró kérdésem lenne, biztos csak valamit elnéztem, de nem jövök rá:

HTML:
  1. <div id="sm1" style="top: 40px; left: 150px; z-index: 1"><ul>  
  2. <li><a href="#">&nbsp;&nbsp;Link1&nbsp;&nbsp;</a></li>  
  3. <li><a href="#">&nbsp;&nbsp;Link2&nbsp;&nbsp;</a></li>  
  4. <li><a href="#">&nbsp;&nbsp;Link3&nbsp;&nbsp;</a></li>  
  5. </ul></div>  
CSS:
  1. #sm1 a  
  2. {  
  3. font-size: 14px;  
  4. }  
  5. #sm1 li {  
  6. float: left;  
  7. }  
  8. li {  
  9. line-height: 16px  
  10. }  
  11. ul {  
  12. list-style-type: none;  
  13. margin-left: 0px;  
  14. padding-left: 0px;  
  15. border: solid red;  
  16. }  
  17. div {  
  18. position: absolute;  
  19. }  
  20. a {  
  21. background-color:#33594E;  
  22. font-size: 12px;  
  23. font-weight: bold;  
  24. color:white;  
  25. cursor:pointer;  
  26. }    
  27. a:link,a:visited{  
  28. text-decoration: none;  
  29. }  
  30. a:hover{  
  31. background-color: #437566;  
  32. color: white;  
  33. }  
A probléma az, hogy csak felülre tesz keretet, oldalra ill. alulra nem. Miért?
Ha a float:left részt kihagyom, akkor viszont ok a keret.
‹ DIV-ben HTML oldal nyitás (CSS) Saját checkbox designom nem megy IE-ben ›
 ■
1

display: inline;

tiku I tikaszvince · 2006. Már. 12. (V), 10.25
Talán a float: left; helyett próbáld ki a display: inline; szabályt.

Amúgy meg van a kereted mind 4 oldal, csak mivel a belül levő il elemeket lebegteted nincs belül olyan elem amit körbe foghatna (remélem nem mondok nagy butaságot...), ezért "összecsúszik" a kereted.
Az is egy megoldás, ha az ul elemre is beállítasz egy float: ___; szabályt...

TikuVoltam
2

Hézag

PogiG · 2006. Már. 12. (V), 10.31
Igy van keret, de viszont a LI elemek között hézag van, azt hogy tüntessem el?
3

padding

winston · 2006. Már. 12. (V), 10.45
li elemnek is adj padding 0px tulajdonságot, esetleg ki lehet próbálni még a margin 0px-et, ezek szoktak segíteni.
4

Egyéb?

PogiG · 2006. Már. 12. (V), 10.48
Már mind a kettőt megpróbáltam, nem jó.
7

nemrég volt...

Anonymous · 2006. Már. 12. (V), 13.37
http://weblabor.hu/forumok/temak/12330

gex
5

háttér, vagy a másik megoldás

tiku I tikaszvince · 2006. Már. 12. (V), 10.53
két megoldás is van, ha végiggondolod:
  • Vagy állíts be az ul-nek egy ugyanolyan zöld háttér színt
  • vagy az előbb már mondtam, hogy tegyél az li-ket befogó ul elemre is egy float: left; szabályt.

TikuVoltam
6

Háttér.

PogiG · 2006. Már. 12. (V), 11.00
Köszi, a háttér ok. Pedig ez milyen egyszerű, erre nem is gondoltam.