On Feb 20, 2007, at 10:47 AM, David Dorward wrote:
a better setup (IMHO), is to use a "definition list",
drop your image in the background of the <dl>, giving it the image
size,
use <dt> and 3 <dd>'s in a two row setup to overlay the image.
add text [no display] and links, ... your in business.
Suffers from the usual problems of FIR. i.e. No alt text if images
are disabled and no content screen readers can get to.
==============================================
It's in my sandbox and layed out below.
... you can add more " 's" to fill it out or use a hover.
<http://www.eatons.net/sandbox/no-map.html>
=====================
dl{
width:250px;
height:248px;
background-image: url(callforentries.gif);
color:transparent;
}
dl a{color:transparent;}
dd:hover{border: 1px solid red; }
dt{
width:100%;
height:160px;
}
dd.one{
margin:12px 0px 0px 0px;
width:80px;
height:75px;
}
dd.two{
width:85px;
height:75px;
margin: 12px 0px 0px -2px;
}
dd.three{
width:80px;
height:75px;
margin: 12px 0px 0px -3px;
}
dd.one,dd.two,dd.three{
display:inline-block;
}
==========================
<dl>
<dt>Call for entries 2007 Mississippi Gulf Coast Addy Awards </dt>
<dd class="one"><a href="#1">Enter Now To Win </a></dd>
<dd class="two"><a href="#2">Contest Rules Click Here To Read
More </a></dd>
<dd class="three"><a href="#3">View All Of The Current Entries </
a></dd>
</dl>
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************
