Why have you given the date it's own <h4> tag?
An easier way to handle this, since <h#> tags are typically block-level
elements is to stick like content with like content. Namely your author
and date.
<h1>Nehemia“Skip” James</h1>
<h2>The blues' dark prophet</h2>
<h3>by Keith Purtell</h3>
<h4>March 11, 1998</h4>
Should be more like
<h1>Nehemia “Skip” James</h1>
<h2>The blues' dark prophet</h2>
<h3>by Keith Purtell <span class="date">March 11, 1998</span></h3>
This solves your float issue with the image. Your CSS would need to be:
h3 {
... all your original CSS...
float: left;
width: 100%;
}
h3 .date {
font-weight: normal;
padding-left: 12px;
margin-left: 10px;
border-left: 1px solid #f00;
}
this takes your <h3>, makes it 100% the width of it's parent tag <div
id="article"> and then adds padding to the .date class object within the
<h3> tag.
On 12/28/2010 11:37 AM, Keith Purtell wrote:
Brandtley, it's actually an h3 tag that starts off that name and date
string. Anyway, I changed the css for h3 so that it is display:
inline-block. That achieved the vertical space for the text, but my
leading image is not respecting the rule. It is floating up into the
name and date string. I tried to research this in my Eric Meyer CSS
book without any luck. Can someone suggest the cause?
http://www.keithpurtell.com/kthings/sample.htm
- Keith
--
--
You received this because you are subscribed to the "Design the Web
with CSS" at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
--
--
You received this because you are subscribed to the "Design the Web with CSS"
at Google groups.
To post: [email protected]
To unsubscribe: [email protected]
