Hi,
My CSS rebirth is less than a year old, in its infancy still. So as in human growth I'm mimicking what I see. One of my favorite sites is http://www.bbcamerica.com/bbcamerica.jsp , I've engaged in reworking the index page in CSS. My steps are thwarted when recreating the highlight section, just below tonight's line-up.
The four programs across have started a chain of DIVS that seem more cumbersome than table cells. How would one recommend recreating this in semantically correct CSS, without the tangled mess of DIVS I've birthed.
"Computers need more Africa in them." -Brian Eno Chris http://ckimedia.com
---CSS SNIPPET--
div#high1, #high2{
border: 1px solid #CDCBD2;
width: 140px;
margin: 1% 0 0 2%;
padding:0;
}
.floatRight{
float: right;
width: 140px;}
img.high1, .high2{
background-color: #FF6600;
margin: 0;
padding: 0;
}
.caption, .desc{
border: 1px solid #CDCBD2;
background-color: #CDCBD2;
width: 140px;
height: auto;
margin: 0 0 0 2%;
padding:0;
} .desc{ background-color: #FFF;
} .caption p{ margin-left: 10px;
}
------XHTML SNIPPET--
<div id="highlights">
<div id="high1">
<img name="high1" src="" width="140" height="54" alt="evening highlight one" class="high1" />
</div>
<div class="caption">
<p>This is a Picture</P>
</div>
<div class="desc">
<p>This is what the show is about</p>
</div>
<div id="high2">
<img name="high2" src="" width="140" height="54" alt="evening highlight two" class="high2" />
</div>
<div class="caption" >
<p>This is a Picture</P>
</div>
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
