Hi All,
This seems like a simple CSS problem, but for the life of me, I can't solve it. I've searched the forums and can't find anything.
On a static page: http://buunnicoffee.com/testing2/about-us/, the first subhead "About Our Founders: Elias and Sarina" is extending the full width of the #container and the div with class="entry-content". The rest of the text wraps around the image, but for some reason, this heading is being pushed below the image. Further down the page, another image is floated (it's inside the h3 tag) and the heading wraps around the image just fine. (I have a screenshot of firebug but I don't know how to attach?)
I've played with the following CSS and can't seem to affect this width of the h3:
.entry-content h3 {
color: #582700;
font-size: 15px;
font-style: normal;
font-weight: bold;
line-height: 20px;
margin: 0 0 8px;
padding: 0;
}
.entry-content {
padding: 14px 0 0;
}
#content {
margin: 0 0 0 270px;
overflow: hidden;
width: 690px;
}
.entry-title {
color: #582700;
font-family: Georgia,Georgia,"Times New Roman",Times,serif;
font-size: 19px;
font-weight: bold;
line-height: 22px;
margin: 0;
width: 660px;
}
The reason I included the class "entry-title" is because on the home page, I had to add a width to this to get one of the heads to stay on one line (so maybe it's affecting this?).
In fact, I would rather NOT have a width on the class "entry-title" but using 100% and other tries didn't work.
For that matter, I can't seem to change the width of the text - there's a margin on the right side that's a little too wide for me, but I can't see where there is padding or margin or width that is affecting it.
Is there something with display:block that I should turn off to make this h3 not go below this image?
Please let me know if there is more code I should post. I'm sure this is something so simple, I just can't see it, so thanks so much for taking a look!
