Wrapping span tags inside a div

You have no spaces between your spans, so the browser sees them all as one single long word. If you add a single space or a line break between each span they will be treated as separate words and wrapped accordingly.


It sounds like you are floating the spans inside the div container. If this is the case, and you want the 'tagcloud' to contain (wrap) the floated spans then you need to clear the floats by adding the following to the tagcloud CSS:

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

An explanation of this technique can can be found here: http://www.quirksmode.org/css/clearing.html


Other option is to just set your tags to be displayed inline-block:

.mytags {
   display:inline-block;
}

Try declaring float: left; on the .mytagcloud class. Something like:

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

in your basiclayout.css file, line 71.

Tags:

Html

Css