html - Equal Space Between Table Headers -
i creating practice website arma 2 unit (88th airborne divsion), have created simple navigation bar using table headers hyperlinked, space between table headers dependant on how long word is. there way of making equal space between headers?
html code:
<!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=utf-8" /> <title>88th airborne division</title> <link href="style.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="container"> <div id="banner"><img src="images/logo.png" width="680" height="125" alt="logo" /></div> <div id="navbar"><table width="680" border="0"> <tr> <th>home</th> <th>about us</th> <th>members</th> <th>apply</th> </tr> </table> </div> </div> </body> </html>
css code:
*{ margin:0; } #container { height: 100%; width: 100%; } #banner { height: 125px; width: 680px; margin-left:auto; margin-right:auto; } #navbar { background-color:#333; width: 680px; height:25px; margin-right: auto; margin-left: auto; text-align:center; } th{ border-right-width:medium; border-right-color:#000; border-right-style:groove; }
because of table width=680
, can put in csstr{ width: 170px; }
, or, can change th
in css
tr{ position: relative; /* may put out, maybe work without */ } th{ border-right-width:medium; border-right-color:#000; border-right-style:groove; width: 25%; }
which gives more flexible sizing. also, don't know if have additional borders or margins. if so, td
s not fit in 25% (because dimension measured without margin, padding , border), play (lower percentage until right look).
Comments
Post a Comment