|
|
Froggy
regular
Reg'd: Mon
Posts: 76
|
|
Hi all,
I have made a start on a website for work. I have a plan of what i want it to look like and am using dreamweaver and css to code.
I have a menu bar which is a picture and then a red block bellow called header with the text links inside.
I have used css to do possition of the menupic and links:
#header {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
}
#menu {
position: absolute;
top: 166px;
left: 0px;
width: 100%;
height: 22px;
padding: 5px;
background-color: #FF0000;
color: #FFFFFF;
}
The called them into the html code like this:
<body bgcolor="#FFFFFF">
<div id="header">
<img src="menubar.jpg" alt="header image" width="100%" height="166px"/></div>
<div id="menu">Products | Quote | Make Payment | Download | Portfolio | How to Find Us | Feedback</div>
However the picture is shorted that the red menubar.
Any ideas how i get it to fit 100% of the screen without the scroll and both end at the same time?
any info needed just ask. i hope you can understand me!!
thank you
|
|
ianm
regular
Reg'd: Fri
Posts: 345
Loc: Colchester
|
|
A link to the page would be handy, for your image you have used a width of 100%, you need to specify it in pixels, however what you can do is make it a background image and get it to tile across the page with repeat-x. try this css
#header {
position: absolute;
top: 0px;
left: 0px;
width: 100%;
background: #fff url("../images/menubar.jpg"); background-repeat: repeat-x;
}
#menu {
position: absolute;
top: 166px;
left: 0px;
width: 100%;
height: 22px;
padding: 5px;
background-color: #FF0000;
color: #FFFFFF;
}
then remove the image from you html and see how it looks,
Hope this helps
Reagrds
|
Froggy
regular
Reg'd: Mon
Posts: 76
|
|
Ok thank you for your help.
I have not put the website online yet as we have been looking into getting a dedicated server in work. So am waiting for him to sort that out and i will put the site up then.
Thank you for your advice. I am going to try it out now.
Cheers
|
Froggy
regular
Reg'd: Mon
Posts: 76
|
|
Have worked out why my image bar was longer than the menupic
It was because i used padding: 5px; in my cose for the links bar! when i removed this the bar went 100% acorss my screen just like the image!
|
Previous
Index
Next
Threaded
Edit
Reply
Quote
