Can you help me position correctly in HTML?

F

Fifer Sheep

New member
Hey, I'm having a little trouble positioning the menu on my dads website. I have a header image, and each button is an image on its own. I want these buttons to overlay the main header in a certain position, but I don't really know which type of positioning to use (absolute, relative etc).

Now I have everything on the page in a single <div> so I can keep it in the center using the <center> tag. I feel this may be messing with the positioning as well.

My questions are:

1. What is the best way to center an entire page and leave a background?

2. Which is the best positioning to use to keep the buttons in place over the header correctly?

If you want me to post some code I can.

Thanks in advance!
 
For the body, use

body{
margin:10px 10% 0 10%;
padding:0;border:0
background-image:url(filename.png);
background-repeat:no-repeat;
}

or something like that. That way the margin property of the body is setting your page in the middle, regardless of the screen size.

For the buttons, why not use a horizontal list.

Like this: HTML:

<ul>
<li><a href=""..>Home</a></li>
<li><a...>About</a></li>
<li><a...>Contac</a></li>
<li><a...>Pics</a></li>
</ul>

CSS:

ul{
border:0;
margin:0;
padding:0;
}

li{
background-color:#ffddbb;
padding:0 0.1em 0 0.1em;
margin-left:20px;
list-style:none;
float:left;
}

Or something like that?
 
Back
Top