Jeff
|
Hi There,
I made a great template with this program.
How do I make the header background and the menu background fill the entire width of the web page while all the rest of the content stay in the middle?
Can anyone help with this?
Thank you
Jeff
|
| |
Garry
|
You may like to post your website address here I'll suggest you some css edits on having URL
|
| |
Richard
|
Hi Gary,
My site is here: http://tinyurl.com/r2636x with a simple 1-column theme (content is disabled for now).
I am trying to get full width header to work such as here: http://joomla1.5.youjoomla.info/yousimplicity/
I'd be grateful if you could share some css edits to achieve this.
Thanks,
Richard
|
| |
Your Web Pros
|
Hello Richard,
To make the header run the full width of the page you will need to edit several parts of the CSS. You will have to edit the div.Header section and div.Header-jpeg section to be equal to 100% of the screen and also make the image repeat across the screen.
I added the
width: 100%; and background-repeat: repeat-x; lines and removed any contradicting lines of code. You may also have to add the float:left; code.
div.Header
{
float: left;
width: 100%;
height: 50px;
}
div.Header-jpeg
{
float: left;
width: 100%;
height: 50px;
background-image: url('../images/Header.jpg');
background-repeat: repeat-x;
}
The next section you will have to edit is the body of the page. Even though the header is trying to be 100% of the page width it is being restricted by the body division that it is sitting in. You can see the section below, I changed it to width:100%, mine was originally width:900px
/* begin Box, Sheet */
.Sheet
{
float: center;
z-index:0;
margin:0 auto;
width: 100%;
min-width:35px;
min-height:35px;
}
Notes this may make the body of the site adjust funny so it will have to be centered.
Let me know if you need more clarification.
Your Web Pros - Alex
|
| |
Garry
|
@ Richard
Your menu is placed in <div class="Sheet-body"> and this div is not covering the full screen(width 100%) that's why you can't increase width of navigation and header as it is. Your theme will need some major css edits(needs to increase the width of <div class="Sheet-body"> first) and I advise you to learn some css in order to start doing it.
|
| |