znaczniki SPAN owijania wewnątrz div

Question

mam kilka znaczników div zagnieżdżone wewnątrz siebie i kilku tagów rozpiętości zagnieżdżone jak poniżej: -

<div id="leftcol"> 
    <div id="tagcloud"> 
     <span class="mytags"><a href="">tag1</a></span> 
     <span class="mytags"><a href="">tag2</a></span> 
     <!-- and a few more spans of the same type --> 
    </div> 
</div> 

Teraz problemem jest to, że przęsła przepełnienie ich kontener div tag. Czy ktoś może być na tyle uprzejmy, aby dać mi znać, jak uzyskać te przęsła do zawinięcia w ich pojemnik div (tutaj div z tagcloud id). Oba zewnętrzne elementy div mają określoną szerokość 300 pikseli.

(Dodatkowe informacje - dokonałem resetu css przy użyciu resetowania czcionek YUI po prostu przyzwyczaiłem się do CSS ..) Edytuj: -Strona internetowa może być przeglądnięta na frekshrek.appspot.com .. Chmura znaczników po prostu nie zawija się wewnątrz kontenera

Answer 1

Spróbuj zadeklarować float: left; na klasie .mytagcloud. Coś jak:

.mytagcloud{ 
    float: left; 
    margin: 5px; 
    font-family: 'Reenie Beanie', arial, serif; 
} 

w pliku basiclayout.css, linia 71.

Answer 2

Wygląda na to, że przestawiasz przęsła wewnątrz pojemnika div. Jeśli jest to przypadek, a chcesz „tagcloud” zawierać (okład) z oczkami przęsła to trzeba wyczyścić pływaków przez dodanie następujących do CSS tagcloud:

div.tagcloud { 
    overflow: auto; 
    width: 100%; 
} 

wyjaśnienie tej technice możliwe można znaleźć tutaj: http://www.quirksmode.org/css/clearing.html

Answer 3

Nie masz żadnych spacji między swoimi przęsłami, więc przeglądarka widzi je wszystkie jako jedno długie słowo. Jeśli dodasz pojedynczą spację lub linię podziału między poszczególnymi zakresami, będą one traktowane jako oddzielne słowa i odpowiednio opakowane.

Answer 4

Inną opcją jest po prostu ustawić tagów być wyświetlane inline-block:

.mytags { 
    display:inline-block; 
}