| SitePoint Sponsor |
On the site,
http://www.urturt.com/
I want to extend thee rays (the background of #wrapper) only but keep the width so that nothing really appears to change (except the rays of course)
Would this be the way I should go about this is...
Give wrapper a width of 1200px (or however wide the new image will be), but in order to keep the width at 1000 give it padding-left:200px
Is that ok?
"Oh, and Jenkins--apparently your mother died this morning."
You would want to put padding on each side of the wrapper, as otherwise it would appear off center. I would probably put the background image on the <body> element instead.
I can place multiple images in the body?
Thanks...I wouldn't know this (and I can position it anywhere inside the container?)
what do /i need to add?
body {
margin:0;
padding:0;
background-color:#fff;
/* font-family:Arial, "Helvetica Neue", Helvetica, sans-serif; */
font-family: Helvetica,arial,sans-serif;
background:url('../images/header_bg.jpg') repeat-x;
}
Thanks...
"Oh, and Jenkins--apparently your mother died this morning."
In CSS2, you can't do multiple bg images, but you can add extra divs for styling (though it's better avoided).
You could put the background on the body like this:
But the seal etc. should be part of the bg image, as otherwise alignments will get tricky. You'll have to make the rays longer, too, to make it look like they keep on going.Code:body { background: url("images/wrapper_bg.png") no-repeat scroll 50% 0 transparent; }
k, tried to put seperate backgrounds on the html and body
result: http://www.urturt.com/HTML Code:body { background: url("images/wrapper_bg.png") no-repeat scroll 50% 0 transparent; } html { background:url('images/header_bg.jpg') repeat-x; }
2 things, why is that stupid header bar not showing up and I want to align the left edge of the circle with the left edge of the #wrapper (right now I placed the seal in that spot) but want to move the circle w/rays image to the right so its never ceter and is aligned with #wrapper...
"Oh, and Jenkins--apparently your mother died this morning."
The background on the html element is sitting behind the body background. A better approach would be to create a 100% width div as the first element in the body section to contain that and the menu.
As for the sunray image, you could add and extra 300 px or so whitespace on the left of the image. That will move it over 150px to where you want it.
Ya, makes sence so tried it\
Im kind of a retard when it comes to wordpress (so I dont know how to place the left sidebar inside that div. But I did create a blank div as the first element and gave it a 100% width and stuck the background inside ofit, since im trying to line the seal with the #wrapper div should I relitivelly position that then absolutelly position that new blank div inside that?
"Oh, and Jenkins--apparently your mother died this morning."
Nah, avoid positioning as much as you can.
What I meant was that you should keep the rays image on the body element, but contain your header (the menu etc) inside a div of width: 100%. Place the gray bg on that. Then create a div inside that the same width as the main content wrapper and centered.
That way, the menu and its background will sit over the sunray image that's on the body.
geez... your good
"Oh, and Jenkins--apparently your mother died this morning."
Posting Permissions
Reply With Quote
Bookmarks