So im designing a website in CSS and im trying to center my navigation bar (A Header with links) but when i use the “text-align : center” and “Margin : auto” properties it doesnt work. Here is my HTML file code:
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html;charset=ISO-8859-1">
<title>Brickwood Fire Dept. - Established 2008</title>
<link type="text/css"
rel="stylesheet" href="main_style.css" media="screen"
</head>
<body>
<h1>
Brickwood Fire Department
</h1>
<h2>
Established 2008
</h2>
<h3>
<a class = "home" href = "http://www.brickwoodfiredept.weebly.com">Home</a>
<a href = "http://www.brickwoodfiredept.weebly.com/contact-us">Contact</a>
<a href = "http://www.brickwoodfiredept.weebly.com/media.html">Media</a>
<a href = "http://www.brickwoodfiredept.weebly.com/links">Links</a>
<a href = "http://www.brickwoodfiredept.weebly.com/newsletter">Newsletter</a>
</h3>
</body>
</html>
Here is my CSS code:
a {
color : white ;
background : #32C1DA ;
width : 30% ;
text-align : center ;
font-family : Arial ;
font-size : 150% ;
margin : auto ;
word-spacing : normal
}
The rest of the CSS code is left out to save space.
Something like this
h3 { width : 30% ; text-align : center ; }
a { color : white ; background : #32C1DA ; width : 30% ; text-align : center ; font-
family : Arial ; font-size : 150% ; margin : auto ; word-spacing : normal }