How can I link an entire <div> or <ul>/<li> tag that does not contain anything inside. The tags are controlled by css. I would like to link the entire <div>, <li> Example: <a href="contact.html"><div id="contact"></div></a>, Is this legal, I can get this to work in Safari but it will not work in firefox. CSS code for it is:
Lol, dont worry noone will arrest you for doing that. However, its not valid html. If you want to link an entire <li> or <div> which has nothing inside, you will need to use javascript:
is making sure your <li> doesn't have any padding, and put the <a> inside with a "display:block" and any other declarations you need to make it fill the <li> (Height? Width?)
For a good example, the tabs at the top of the page (Artiles, forums, ...) are <a>'s inside of <li> but you don't even notie the li's
Yeah I would avoid wrapping DIV's or LI's or any other block level element in an anchor. Anchors are inline elements, and that can cause weird results. Even if you redeclare them as block level, that doesn't help much with CSS off.
Your best bet, like The Doc kinda said, is just to put all the stuff inside the anchor to begin with, and if you need internal tags, use spans.
<a href=\"#\"> <span class=\"title\">Big Link Area</span><br /> This whole area is clickable </a>
<a href="folio.html"><li class="b1"></li></a>
<a href="cast.html"><li class="b2"></li></a>
<a href="#"><li class="b3"></li></a>
<a href="contact.html"><li class="b4"></li></a>
</ul>
How can I link an entire <div> or <ul>/<li> tag that does not contain anything inside. The tags are controlled by css. I would like to link the entire <div>, <li> Example: <a href="contact.html"><div id="contact"></div></a>, Is this legal, I can get this to work in Safari but it will not work in firefox. CSS code for it is:
css:
ul{
margin:0px auto;
padding:0;
list-style:none;
width:637px;
}
#default li.b1 {
background:url(../images/menu/default/out_01.png) top center;
width:131px;
height:58px;
list-style:none;
float:left;
display:block;
}
#default li.b1:hover {
background:url(../images/menu/default/over_01.png) top center;
width:131px;
height:58px;
list-style:none;
float:left;
display:block;
}
Thank you.
Lol, dont worry noone will arrest you for doing that. However, its not valid html. If you want to link an entire <li> or <div> which has nothing inside, you will need to use javascript:
beware though, this wont work without javascript.
is making sure your <li> doesn't have any padding, and put the <a> inside with a "display:block" and any other declarations you need to make it fill the <li> (Height? Width?)
For a good example, the tabs at the top of the page (Artiles, forums, ...) are <a>'s inside of <li> but you don't even notie the li's
Ashton Sanders
HTML:
CSS:
div.name a {height:100px;
width:200px;
display:block;
background:black;
text-indent:-99999px;
}
An area of 200x100px with a black background should be clickable.
Your best bet, like The Doc kinda said, is just to put all the stuff inside the anchor to begin with, and if you need internal tags, use spans.