blogsmith Posted September 21, 2009 Share Posted September 21, 2009 I am desirous of creating a horizontal menu bar using table but am aware that there are criticisms - I think it was something about not proper using table for layout. Since I am most familiar with <table>, I am highly tempted to use it and would do so if this "not table for layout" is only a nicety like "not blowing your nose in public".Seeking advice and feedback. Link to comment Share on other sites More sharing options...
Synook Posted September 21, 2009 Share Posted September 21, 2009 No, tables should never be used for layout, just like you would never spit on other people in public.http://www.hotdesign.com/seybold/ Link to comment Share on other sites More sharing options...
blogsmith Posted September 21, 2009 Author Share Posted September 21, 2009 No, tables should never be used for layout, just like you would never spit on other people in public.http://www.hotdesign.com/seybold/ Sigh! Then a linear series of hyperlink tags separated by | like<a href="url1">menu 1</a>|<a href="url2">menu 2</a>|<a href="url3">menu3</a> etc.Would that be better?Any other suggestions? I have a fair knowledge of HTML and a bit of CSS, so may have to struggle with more complicated methods like frame etc Link to comment Share on other sites More sharing options...
blogsmith Posted September 21, 2009 Author Share Posted September 21, 2009 Sigh! Then a linear series of hyperlink tags separated by | like<a href="url1">menu 1</a>|<a href="url2">menu 2</a>|<a href="url3">menu3</a> etc.Would that be better?Any other suggestions? I have a fair knowledge of HTML and a bit of CSS, so may have to struggle with more complicated methods like frame etcMaybe add a bit of background color like<div style="background-color:green;"><a href="url1">menu 1</a>|<a href="url2">menu 2</a>|<a href="url3">menu3</a> etc.</div>or add some line breaks to create margin<br /><div style="background-color:green;"><a href="url1">menu 1</a>|<a href="url2">menu 2</a>|<a href="url3">menu3</a> etc.</div><br />????? Link to comment Share on other sites More sharing options...
Synook Posted September 21, 2009 Share Posted September 21, 2009 The best way is to use an UL, then float the elements. Link to comment Share on other sites More sharing options...
dsonesuk Posted September 21, 2009 Share Posted September 21, 2009 <!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"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><script type="text/javascript">/*<![CDATA[*//*---->*//*--*//*]]>*/</script> <style type="text/css">ul {list-style:none;}li a, li{float:left; background-color:#66CCFF; color: #fff;}li a {display:block; text-decoration:none; padding: 0 12px; height: 24px; line-height: 24px; color:#00F;}li a:hover {background-color:#0000FF; color:#FFF;}</style></head><body><ul><li><a href="url1">menu 1</a>|</li><li><a href="url2">menu 2</a>|</li><li><a href="url3">menu3</a></li></ul><div style="clear:both;"></div><p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex.</p> </body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.