|
|
Posted by ironcorona on 11/24/68 11:46
Rob Stampfli wrote:
> In article <44559756$1@quokka.wn.com.au>,
> ironcorona <iron.corona@gmail.com> wrote:
>> Rob Stampfli wrote:
>>> Suppose you have a container of unknown or variable size.
>>> How would you specify a link tag inside it such that it
>>> takes up the entire container
>> in the css:
>>
>> a {display:block; width:100%; height:100%;}
>>
>> I only discovered the fun things you can do with the anchor tag, if you
>> set it to display as a block, a few weeks ago.
>
> This doesn't seem to work for me.
I'm stumped by your code. I can't work out what is keeping the "Hello
World" link in the centre (vertically). I've taken out everything that
could be responsible for it and it's still hanging there, looking at
me... Try it out. It's freaky as hell. It's the code from this page:
http://cboh.org/spantest.html
And it's what caused my suggestion not to work.
Just one thing; if you've set the width and height properties for a box
you don't need a non-breaking-space to hold it open. Anyway, here's
some code, very similar to your own where what I proposed above worked
(it's a little simplified from your version):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>test</title>
<style type="text/css">
table {margin:0 auto;}
td {width:100px; height:200px;}
td a {display:block; width:100%; height:100%; background-color:orange;
text-align:center;}
a:hover {background-color:yellow;}
</style>
</head>
<body>
<table border="1"><tr>
<td>
</td>
<td style="width:200px;">
<a href="#">Hello world</a>
</td>
<td>
</td>
</tr></table>
</body>
</html>
There's no good way to get the link in the centre (vertically) so this
is as close as I can get. I might suggest using an image instead of
link text.
--
ironcorona
[Back to original message]
|