Re: [WSG] Site Issue - opinions please

[Charles Eaton]

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 "&nbsp;'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]
*******************************************************************