|
Page 1 of 1
|
[ 7 posts ] |
|
Author |
Message |
|
Post subject: Backgrounds and top images - CSS hates me Posted: November 21st, 2008, 11:20 pm |
|
Joined: 10 July 2005 Posts: 23149 Location: Where there are handsome heroes and sexy villains.. all that need some lovin' ;) Country:
Gender: Female
|
Ok, so I am *trying* to make my second layout. It was all going hunky-dory until my background image and top image decided they didn't like each other and won't match up.
I was following Gil's tutorial, which was going great.
I have a background image like she has: http://www.skyward-thoughts.com/images/ ... uttut7.jpg
And a top image: http://www.skyward-thoughts.com/images/ ... uttut6.jpg
With the code she has provided, as far as I know I have done everything correctly, although my navigation bar I don't need, so I have omitted that part of the code.
I am having trouble aligning the main content to match the header, but I can deal with that, as I can obviously change the pixel width or height.
But I can't seem to find anything in the code that will allow me to change the background or even the header so they match. At the moment the header is where is should be, but part of the background just repeats itself.
The orange part should actually be all there is in that area as that is the background. The red shouldn't be there as that is the content background and is on the opposite side to where this is.
All I can see is that according to Gil's tutorial, the top image needed to have some of the red content colour below the header, which is what I did. And from the way the background is misplaced, you can clearly see where the top image begins so I can only presume it's the background I need to fix.
Any ideas anyone?
_________________
^ By me and my SS *squiggle hugs*
|
|
Top |
|
|
|
Post subject: Posted: November 22nd, 2008, 11:45 am |
|
Joined: 04 February 2006 Posts: 9445 Location: Southeast of the Northern part of West Hyglemr Country:
Gender: Female
|
It's really hard to tell without seeing your CCS. For me, at least, there may be some web geniuses out there who can help you.
Okay, so in your current layout you have
Code: body { background-color : #000000; background-position : center 0%; background-attachment : scroll;
How much of that is changed? I don't know if that would make a difference, but it is possible.
_________________ going on a journey through my old claims
|
|
Top |
|
|
|
Post subject: Posted: November 22nd, 2008, 12:00 pm |
|
Joined: 10 July 2005 Posts: 23149 Location: Where there are handsome heroes and sexy villains.. all that need some lovin' ;) Country:
Gender: Female
|
Here is my style.css
Quote: #content{ position:absolute; top:450px; left:80px; width:550px; filter:alpha(opacity=100); }
body{ background: url('http://img212.imageshack.us/img212/4384/bggvh4.jpg'); background-position : center 0%; background-attachment : scroll; position:absolute; margin-top:0px; margin-left:0px; color:#EBDDC7; font-family:arial; font-size:8pt; }
a{ text-decoration: none; color: #E09646; }
a:hover{ text-decoration: none; color: #EBDDC7; } When I added the code you gave me, the red moved to the left hand side, rather than it being on the right. So it looks better although it still doesn't match.
This is my index code, well just the top part.Quote: <html> <head> <title>Paved With Stars</title > <link href="stlyes.css" rel="stylesheet" type="text/css"> </head>
<body marginleft="0" margintop="0">
<img src="http://img165.imageshack.us/img165/6353/topimageedn8.jpg">
<div id="content">
In an ideal world, I don't want to use the img src as where my header goes, as I have imagemapped a header instead, but I wanted to try and get the layout sorted before I attempted to use that. It's quite frustrating really as I can see it's almost there.
I'm just glad there are people out there who know what they're doing with layouts.
_________________
^ By me and my SS *squiggle hugs*
|
|
Top |
|
|
|
Post subject: Posted: November 22nd, 2008, 12:57 pm |
|
Joined: 04 February 2006 Posts: 9445 Location: Southeast of the Northern part of West Hyglemr Country:
Gender: Female
|
Okay, that's helpful. Don't look at the code I posted. I think the problem may be the background position thing. I'd try getting rid of the background-position:0 and changing "scroll" to fixed and see what that does.
Quote: #content{ position:absolute; top:450px; left:80px; width:550px; filter:alpha(opacity=100); }
body{ background: url('http://img212.imageshack.us/img212/4384/bggvh4.jpg'); background-position : center 0%; background-attachment : scroll; position:absolute; margin-top:0px; margin-left:0px; color:#EBDDC7; font-family:arial; font-size:8pt; }
a{ text-decoration: none; color: #E09646; }
a:hover{ text-decoration: none; color: #EBDDC7; }
I'm happy to try to help. Don't know if it works, but trying.
_________________ going on a journey through my old claims
|
|
Top |
|
|
|
Post subject: Posted: November 22nd, 2008, 7:44 pm |
|
Joined: 10 July 2005 Posts: 23149 Location: Where there are handsome heroes and sexy villains.. all that need some lovin' ;) Country:
Gender: Female
|
Hmm, I tried that and it just went back to how it was before I used the code you gave me.
_________________
^ By me and my SS *squiggle hugs*
|
|
Top |
|
|
|
Post subject: Posted: November 22nd, 2008, 11:13 pm |
|
Joined: 04 June 2005 Posts: 4449 Location: Northern USA
|
I will try to figure this out within the next week It is most likely that I am forgetting something in the code to tell all you wonderful people, but it might take me a little bit to find it xD
But no fear! Gil is here and I will do my best to fix it haha!
_________________
<center> icon & banner by me skyward-thoughts</center>
|
|
Top |
|
|
|
Post subject: Posted: November 23rd, 2008, 12:43 pm |
|
Joined: 10 July 2005 Posts: 23149 Location: Where there are handsome heroes and sexy villains.. all that need some lovin' ;) Country:
Gender: Female
|
|
Top |
|
|
|
Page 1 of 1
|
[ 7 posts ] |
|
Who is online |
Users browsing this forum: No registered users and 12 guests |
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot post attachments in this forum
|
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
Boyz theme by Zarron Media 2003
|
|