how to centre the menu on my site, css? html? thanks

  • 1
  • Question
  • Updated 6 years ago
  • Answered
hello. am trying to centre the menu on my web page.
have upgraded to change css etc but am having no luck.
could anyone please advise. thankyou!

do not have any idea how to use css, so as much info as possible would be highly appreciated! :)

here is the site so you can hopefully see what i mean : www.newthey.co.uk
Photo of leon hatcher

leon hatcher

  • 2 Posts
  • 0 Reply Likes

Posted 6 years ago

  • 1
Photo of leon hatcher

leon hatcher

  • 2 Posts
  • 0 Reply Likes
here is my site css if this helps? thanks

/* CSS Document */

body {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #FFFFFF;
background-color:#000000;
background-repeat:;
background-position:;
background-attachment:;
}

td, tr {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #FFFFFF;
}

h1 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 30px;
}

h2 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 26px;
}

h3 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 22px;
}

h4 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 20px;
}

h5 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 14px;
}

h6 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 11px;
}

a:link {
text-decoration: none;
color: #CCCCCC;
}

a:visited {
text-decoration: none;
color: #CCCCCC;
}

a:hover {
text-decoration: underline;
color: #FFFFFF;
}

body {
margin-top: 0px;
}

.container {
width: 900px;
margin: 0px auto;
}

#sys_banner {
width:900px;
height:125px;
/* this is wierd. but for some reason, if there is no border it drops down a few pixels! border-top:solid 1px #000000;
*/

padding:1px 0 0 0;
}

#sys_banner h1 {
padding: 20px;
}

#sys_banner h1 a {
text-decoration:none;
color: #CCCCCC;
}

#sys_banner h1 a:hover {
text-decoration:none;
color: #FFFFFF;
}

#menu {
margin: 0;
margin-left: 5px;
margin-right: 5px;
border-bottom:solid 1px #666666;
}

#menu ul {
list-style: none;
float:left;
margin-left:0px;
padding:10px;
}

#menu ul li {
display: inline;
font-size:larger;
padding-right:20px;
}

#menu ul li a {
text-decoration:none;
font-size:14px;
}

#content {
padding: 1em;
/*background:blue;
color:white;
*/

}

.sys_footer {
margin-left: 5px;
margin-right: 5px;
text-align:right;
font-size:small;
border-top:solid 1px #666666;
}

#sys_designerfooter {
border-top:0px;
padding-top:10px;
}

.sys_txt {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 12px;
color: #FFFFFF;
}

.sys_txt h1 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 30px;
}

.sys_txt h2 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 26px;
}

.sys_txt h3 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 22px;
}

.sys_txt h4 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 20px;
}

.sys_txt h5 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 14px;
}

.sys_txt h6 {
font-family: "Lucida Grande","Arial Unicode MS", sans-serif;
font-size: 11px;
}

.sys_txt a:link {
text-decoration:underline;
color: #CCCCCC;
}

.sys_txt a:visited {
text-decoration:underline
}

.sys_txt a:hover {
text-decoration:underline color: #FFFFFF;
}
Photo of Sanja

Sanja, Official Rep

  • 10698 Posts
  • 495 Reply Likes
Hello Leon,

It appears that you have successfully centered your menu navigation. I've attached a screenshot to show you what I see.



Please let us know if you still have issues.