By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,445 Members | 1,160 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,445 IT Pros & Developers. It's quick & easy.

Make <a> fill whole table cell of not specified size

P: n/a
Hello,

How can I make an <a> element (containing text only, styled to be a box with
a border) as big as the table cell in which it resides, *without* having
specified any width/height (neither fixed nor percentage) for this table
cell?

Sizing the element to 100% width and height does not work, as the parent
element's width and height are not specified. And yet, in this case at
least, the width and height of the table cell are very well defined by the
link text it contains. However, if another cell happens to have more
contents and thus forces my link cell to be bigger than necessary to
accomodate my link text, the "box-styled" <a> element will not automatically
stretch out to fill the whole table cell.

Is there a way to achieve what I want, or would I *have* to set a fix or
percentage width/height for the table cell?

Thomas
Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
Thomas Mlynarczyk wrote:

How can I make an <a> element (containing text only, styled to be a box with
a border) as big as the table cell in which it resides, *without* having
specified any width/height (neither fixed nor percentage) for this table
cell?


I think you're looking for display: block.

td a {
display: block;
}

--
Brian
follow the directions in my address to email me

Jul 20 '05 #2

P: n/a
Also sprach Brian:
How can I make an <a> element (containing text only, styled to be a
box with a border) as big as the table cell in which it resides,
*without* having specified any width/height (neither fixed nor
percentage) for this table cell?
I think you're looking for display: block.

td a {
display: block;
}


I am already using that:

a {
display:block;
width:100%;
height:100%;
border-top:2px solid #FFFFCC;
border-right:2px solid #999900;
border-bottom:2px solid #999900;
border-left:2px solid #FFFFCC;
margin:0px;
padding:3px;
}

The above works as intended with IE5, but Mozilla screws it up - because of
the width/height "100%". But without that, the <a> element will not always
completely fill the table cell in which it resides, namely not if other
cells' contents forces the cell with the link to be bigger than necessary to
accomodate my link.

Jul 20 '05 #3

P: n/a
Thomas Mlynarczyk wrote:
Also sprach Brian:
How can I make an <a> element (containing text only, styled to be a
box with a border) as big as the table cell in which it resides,

I think you're looking for display: block.

td a {
display: block;
}


I am already using that

works as intended with IE5, but Mozilla screws it up - because of
the width/height "100%".


url?

--
Brian
follow the directions in my address to email me

Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.