Make div obey floated div

HTML & CSS
1

OK - in this example I want the orange div#highlight to obey the width & margins of the right floated div#right_col.

The amount of images in #right_col will varying in height for each page. The position of #highlight within the content will also vary.

What I would like is for div#highlight to be width 100% when not next to div#right_col, and if it is next to div#right_col, to obey the margins and width of div#right_col.

So as it is at the moment, the div would not be 100% width in the ideal situation.

Is this possible?

2

Just add overflow: hidden to the highlight div, like so:


#highlight {
  background-color: #FFCC66;
  border: 1px solid red;
  color: red;
  [COLOR="#FF0000"]overflow: hidden;[/COLOR]
  padding: 10px;
}
3

too easy :slight_smile:

Thank you - I have been wondering about that for a while now :slight_smile: