Title: CSS: having align / overflow problems
Last modified: March 13, 2017

---

# CSS: having align / overflow problems

 *  Resolved [Guido](https://wordpress.org/support/users/guido07111975/)
 * (@guido07111975)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/)
 * _[ Moderator note: [moved to Fixing WordPress](https://wordpress.org/support/topic/wheres-my-topic-gone?replies=1&view=all).]_
 * Hi forum users,
 * I did use this to style a full width block element:
 *     ```
       .div {clear:both; display:block;}
       ```
   
 * But while developing a theme I now and then encounter problems with elements 
   which don’t align properly and overflow the margin/padding top/bottom of the 
   element above/underneath.
 * So in those cases I use this CSS:
 *     ```
       .div {width:100%; clear:both; float:left; display:block;}
       ```
   
 * In case with border:
 *     ```
       .div {width:100%; clear:both; float:left; display:block; border:2px solid #333; box-sizing:border-box;}
       ```
   
 * But I don’t want to use the width property too much, is there another way to 
   solve the alignment/overflow issue?
 * Guido

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [graphicscove](https://wordpress.org/support/users/graphicscove/)
 * (@graphicscove)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/#post-8906682)
 * Hello Guido,
 * It might be useful to put an actual example into [Codepen](http://codepen.io/pen/)
   so we can see these things in action.
 * You also shouldn’t need to add ‘display: block;’ to a div element as they are
   block by default. They should also fill the full width of its parent so the width
   property isn’t needed. If you have any examples in real scenarios it would help.
 * Put the clearfix on the parent of the floated element.
 * ~ Steven
 *  Thread Starter [Guido](https://wordpress.org/support/users/guido07111975/)
 * (@guido07111975)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/#post-8909826)
 * Hi Steven,
 * Thanks for your response. Although I’m developing themes for several years now,
   I clearly still don’t know everything about CSS… shame on me 😉
 * I have set up a temp test site, check [this](http://www.webmastergroningen.nl/wordpress/example-post-1)
   link.
 * Example: if you inspect .div postmetadata, located underneath .div entry-content,
   you will notice it overflows the margin of the paragraph tag which is inside .
   div entry-content.
 * I did solve this by adding width and float to .div postmetadata. But what’s the
   proper way?
 * Guido
 *  Thread Starter [Guido](https://wordpress.org/support/users/guido07111975/)
 * (@guido07111975)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/#post-8909855)
 * Oh, about the clearfix.. I do use it sometimes but in my opinion you should only
   use this if there’s absolutely no alternative.. I cannot imagine there’s no alternative
   for the problem described in my previous response.
 * Guido
 *  Thread Starter [Guido](https://wordpress.org/support/users/guido07111975/)
 * (@guido07111975)
 * [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/#post-8913751)
 * > Example: if you inspect .div postmetadata, located underneath .div entry-content,
   > you will notice it overflows the margin of the paragraph tag which is inside.
   > div entry-content.
 * I’ve found out why… [collapsing margins](http://www.w3.org/TR/CSS2/box.html#collapsing-margins)!
   Never heard of this before..

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘CSS: having align / overflow problems’ is closed to new replies.

## Tags

 * [align](https://wordpress.org/support/topic-tag/align/)
 * [css](https://wordpress.org/support/topic-tag/css/)
 * [overflow](https://wordpress.org/support/topic-tag/overflow/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 4 replies
 * 2 participants
 * Last reply from: [Guido](https://wordpress.org/support/users/guido07111975/)
 * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/css-having-align-overflow-problems/#post-8913751)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics