[thelist] xhtml validation of CSS image gallery

[Bill Moseley]

On Fri, Jan 12, 2007 at 04:41:25PM -0700, Bob Meetin wrote:
> I got this gallery to work in both IE6 and Firefox, but can't get it to 
> validate as xhtml compliant because of the <ul><li></li></ul> contained 
> within a <a href></a>.  I'm using the unordered list to position the 
> image title in the center and just above the bottom of the image 
> container.  I run into the same problem if I use a paragraph <p></p>.

So your goal is to get the entire <div> clickable as a link?

Someone with better css skills might help, but what think I've done
is:

    <div>
        <a class="hide" href="link.html"><span>click here</span></a>

        <ul>
            <li><a href="link.html">text</a></li>
            <li><a href="link.html">text</a></li>
            <li><a href="link.html">text</a></li>
        </ul>
    </div>

Then position the hide absolute and move the span off page.

That is something like this:

    a.hide {
        position: absolute;
        width: 100%;
        height: 100%;
    }

    .hide span {
        left: -3000px;
        position: absolute;
    }

-- 
Bill Moseley
moseley at hank.org