Title: CSS Div Width
Last modified: August 20, 2016

---

# CSS Div Width

 *  [Tom Ewer](https://wordpress.org/support/users/tomewer/)
 * (@tomewer)
 * [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/)
 * Hello,
 * I have a div that I like to use on occasion to highlight text. You can see examples
   here (the grey boxes at the start of the posts):
 * [http://www.leavingworkbehind.com/my-first-niche-site-update-9-a-fresh-approach/](http://www.leavingworkbehind.com/my-first-niche-site-update-9-a-fresh-approach/)
   
   [http://www.leavingworkbehind.com/8-ways-to-survive-your-day-job/](http://www.leavingworkbehind.com/8-ways-to-survive-your-day-job/)
 * How can I make it so that the boxes do not wrap behind the image (as in the first
   link), but also stretch to fill the width of the post, depending on the circumstances?
 * This is the code I use at the moment:
 *     ```
       .lwb_tweetme {
       width: auto;
       border: 1px solid #dbdbdb;
       background-color: #f5f5f5;
       padding: 10px;
       font-weight: bold;
       }
       ```
   
 * Thanks in advance!
 * Tom

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

 *  [David Wang](https://wordpress.org/support/users/blogjunkie/)
 * (@blogjunkie)
 * [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/#post-2520372)
 * I don’t think it’s possible to do automatically because that’s the way CSS floats
   work. You could use this hack though:
 * `<p class="lab_tweetme" style="width:300px;">highlight content</p>`
 *  Thread Starter [Tom Ewer](https://wordpress.org/support/users/tomewer/)
 * (@tomewer)
 * [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/#post-2520408)
 * Hi blogjunkie,
 * Thanks for the suggestion. Whilst that would work for now, it wouldn’t be future
   proof (e.g. if at some point in the future I increased the content width, the
   box would be too narrow). Any other ideas?
 * I thought that there would be a relatively straightforward answer – something
   along the lines of floating one element to the right, the other to the left, 
   and instructing the div to fill the gap?
 * Thanks again!
 * Tom
 *  [David Wang](https://wordpress.org/support/users/blogjunkie/)
 * (@blogjunkie)
 * [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/#post-2520481)
 * Yes, it’s not future proof. You won’t be able to do it the way you envision unless
   the markup is changed. The problem is that you have a markup like this:
 *     ```
       <div class="entry">
           <div class="wp-caption alignright">...</div>
           <p class="lwb_tweetme">...</p>
           Your content...
       ```
   
 * You’d need your content to be in a div of it’s own to achieve a layout like that.
   So.. sorry, no easy answer for what you want to my knowledge. I’ve struggled 
   with this problem myself too :/
 *  Thread Starter [Tom Ewer](https://wordpress.org/support/users/tomewer/)
 * (@tomewer)
 * [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/#post-2520533)
 * Are you saying that if I change this:
 * `<p class="lwb_tweetme">...</p>`
 * to this:
 * `<div class="lwb_tweetme">...</div>`
 * I can get it to work in the way that I want? If so, that wouldn’t be a problem–
   it’d only take 10-15 mins to change the old <p>’s, and I could just use divs 
   in the future.
 * Thanks again! 🙂
 * Tom

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

The topic ‘CSS Div Width’ is closed to new replies.

 * 4 replies
 * 2 participants
 * Last reply from: [Tom Ewer](https://wordpress.org/support/users/tomewer/)
 * Last activity: [14 years, 4 months ago](https://wordpress.org/support/topic/css-div-width/#post-2520533)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
