KyleKJune Posted July 24, 2009 Share Posted July 24, 2009 in the table how do i make it so that if you put your mouse anywhere in the td areas you can click.if you click in the box it doesn't do anything. it only works if you click text.i want it to be clickable in whole box so that you have more clicking area. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><title>KyleKJune</title><link rel="stylesheet" type="text/css"href="style.css" /></head><body><img src="banner.gif"><table align="top" border="0" id="menubar"><tr><td id="menu" ><a href="" id="textwhite">Home</a></td><td id="menu" ><a href="" id="textwhite">Contact</a></td><td id="menu" ><a href="" id="textwhite">search</a></td><td id="menu" ><a href="" id="textwhite">other</a></td><td id="menublank" ></td></tr></table></body></html> Link to comment Share on other sites More sharing options...
justsomeguy Posted July 24, 2009 Share Posted July 24, 2009 Add an onclick handler to the td:<td onclick="alert('click');">You could also set the <a> elements to take up the whole size of the td. Link to comment Share on other sites More sharing options...
KyleKJune Posted July 24, 2009 Author Share Posted July 24, 2009 Add an onclick handler to the td:<td onclick="alert('click');">You could also set the <a> elements to take up the whole size of the td.how do i make the a elements take up the whole size of the td? Link to comment Share on other sites More sharing options...
justsomeguy Posted July 24, 2009 Share Posted July 24, 2009 Add CSS rules to set the width and height to 100%. Also, you can't have more than one element with the same ID. If you want to apply the same styles to your links use a class instead of ID. Link to comment Share on other sites More sharing options...
KyleKJune Posted July 24, 2009 Author Share Posted July 24, 2009 Add CSS rules to set the width and height to 100%. Also, you can't have more than one element with the same ID. If you want to apply the same styles to your links use a class instead of ID.im made the id=menuoptions}#menuoptions{ color:white; font-size : xx-large; text-decoration : none; width : 100%; height : 100%;}its not taking up the whole td box. Link to comment Share on other sites More sharing options...
justsomeguy Posted July 24, 2009 Share Posted July 24, 2009 Don't use more than one element with the same ID. You have 4 elements with the ID "menu" and 4 with the ID "menuoptions". You can't have more than one element with the same ID. If you want to apply the same styles to more than one element, use a class instead of an id.In addition to width and height, also set the display property to "block". Link to comment Share on other sites More sharing options...
KyleKJune Posted July 24, 2009 Author Share Posted July 24, 2009 Don't use more than one element with the same ID. You have 4 elements with the ID "menu" and 4 with the ID "menuoptions". You can't have more than one element with the same ID. If you want to apply the same styles to more than one element, use a class instead of an id.In addition to width and height, also set the display property to "block".im new at this. im trying to learn more about html by making a website. could you show me what my html and css file should say? Link to comment Share on other sites More sharing options...
justsomeguy Posted July 24, 2009 Share Posted July 24, 2009 Use a class:<a href="" class="textwhite">And in the CSS, use a . to start the class name instead of a #. Then just add "display: block;". Link to comment Share on other sites More sharing options...
KyleKJune Posted July 24, 2009 Author Share Posted July 24, 2009 Use a class:<a href="" class="textwhite">And in the CSS, use a . to start the class name instead of a #. Then just add "display: block;".heres my html<tr><td id="menu" ><a href="/home.html" class="menuoptions">Home</a></td><td id="menu" ><a href="/contact.html" class="menuoptions">Contact</a></td><td id="menu" ><a href="/search.html" class="menuoptions">Search</a></td>here is my cssa .menuoptions{ color:white; font-size : xx-large; text-decoration : none; display : block;}is that how i should have it because its not working right. Link to comment Share on other sites More sharing options...
KyleKJune Posted July 24, 2009 Author Share Posted July 24, 2009 nvm i found out what was wrong.on my css file i had a space between a.menuoptions like bellowa .menuoptionsthank you justsomeguy for your help. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.