Cow
Cow

Reputation: 769

CSS span not wrapping fully

I am having some issues with wrapping stuff to a new line when it reaches the max width. I have my blog set up displaying all of the tags in a single div, and when the first line reaches the max width the next tag should jump to the next line. (Attached is what is happening in Chrome and Firefox)

http://jsfiddle.net/QHWNF/7/

Here is the CSS Code:

p.tagHolder{
margin-bottom:5px;
line-height:25px;}

All the HTML/PHP is:

<a href="#"><span>TagName</span></a><a href="#"><span>TagName2</span></a>....

Chrome Firefox

Upvotes: 9

Views: 18093

Answers (2)

Nate
Nate

Reputation: 4948

Try setting your spans to display: inline-block.

http://jsfiddle.net/QHWNF/10/

Upvotes: 21

Chris
Chris

Reputation: 26878

Add word-wrap: normal; and word-break: normal; to your span and p container. This would make sure that words are broken only at allowed break-points when there's need for wrap.

I hope that helped!

Upvotes: 1

Related Questions