Hey, I have a specific width set to a div I have (200px) and I'm using the standard wordpress tag cloud code (small to big font size tags) inside of it. Problem is the tags exceed with width of the div.

 

Is there something you are supposed to do beyond standard practice? Perhaps a way to control the tag?

 

This is the code

<div id="#footer-cloud">
  <h2>Popular tags</h2>
  <?php wp_tag_cloud('smallest=8&largest=24&'); ?>
</div>

#footer-cloud {
width: 200px;
float: left;
}

 

and it probably extends out an additional 200px in width.

 

Any thoughts as to what I'm doing wrong here?

Why not just reduce the tag cloud font sizes in the php code

<?php wp_tag_cloud('smallest=6&largest=16&'); ?> 

I can do that, but I guess I just expect it to wrap down in the infinite height I allow it instead of continually extending to the right.

I suppose you could try the overflow property, to see if that helps such as

overflow: hidden;

you could also use

word-wrap: break-word;

to see if that helps

thank you I will try that!

Yeah, that did not help either :-/

It's not making sense as to why if I set it to 200px width it exceeds it.

Yeah, that did not help either :-/

It's not making sense as to why if I set it to 200px width it exceeds it.

 

I am sure this is a typo, but shouldnt

<div id="#footer-cloud">

 

Just be

<div id="footer-cloud">

 

Pat

 

Well spotted Pat!

WOW.

Apparently I did that for almost every DIV in the footer.

 

I worked on this site for about 48 straight hours (I was the 3rd designer hired and the other two flaked so time was of the essence) and got about 3hrs of sleep. Hmm, not always the most efficient way to work obviously.

 

Thanks for looking it over for me!!

Yes, if your tag cloud is exceeding the width of your div, you can try adjusting the font sizes of the tags or the spacing between them. Here are a few possible solutions you can try:

Reduce the font size of the tags: You can try reducing the font size of the tags until they fit within the width of the div. To do this, you can add CSS code to your stylesheet. For example:
.tagcloud a { font-size: 12px; }
Increase the spacing between the tags: Another option is to increase the spacing between the tags. You can do this by adding margin or padding to the tags. For example:
.tagcloud a { margin-right: 5px; }

Use a plugin or custom code: There are several WordPress plugins available that can help you customize the appearance of your tag cloud. Alternatively, you can write your own custom code to style the tag cloud to your liking.
Keep in mind that adjusting the font size or spacing of the tags can affect the overall look and feel of your tag cloud, so you may need to experiment with different settings to find the right balance.