8 replies [Last post]
ivygirl
Offline
newbie
Last seen: 17 years 25 weeks ago
Joined: 2004-06-06
Posts: 4
Points: 0

Hi all,

I'm a novice when it comes to css so I'm sure this is an easy fix but....

I have a two column layout with a header. I've been struggling for most of the morning to get the header to align in the center. Fixed that with "position:absolute" but when I did that it now pushes my content column up to the top, making the first portion of my text fall behind the header. Look at www.thewritingcafe.com and you'll see what I'm talking about. I have the top margin set at 232px which should be right.

What am I missing???

Thanks Cool

Kate

Bigdawg
Offline
Enthusiast
Last seen: 17 years 50 weeks ago
Joined: 2003-12-16
Posts: 65
Points: 0

Layout Problems

I am assuming you already fixed it otherwise I do not see what your are talking about Looks like it aligns right in Mozilla {header & Do You Dream of Being A Freelance Writer?} as this is what I think you are referring to! ??

ivygirl
Offline
newbie
Last seen: 17 years 25 weeks ago
Joined: 2004-06-06
Posts: 4
Points: 0

Layout Problems

Hi there,

Yes, that is what I'm referring to. I don't have Mozilla - I'm looking at it in IE and "Do You Dream..." is behind the header. You can't see the text until you get down to the testimonial. Is this an IE issue, maybe?

Thanks,

Kate

Bigdawg
Offline
Enthusiast
Last seen: 17 years 50 weeks ago
Joined: 2003-12-16
Posts: 65
Points: 0

Layout Problems

Now I see what you are talking about! Your site displays fine in Mozilla normally it is IE that is more forgiving. My brain is having a seroius warp right now but I will look at it and see if I can see a workaround.

For starters you have you style sheet linked twice and it is fine without the style sheet in html in IE

Style your fonts with css instead of with html so you do not have one overriding the other. Right now your page displays how you want it with the css removed because of your html.
Your code has a lot of errors in it you may want to drop the css because you are defining all fonts in your html otherwise you {should declare all this in your css. Also many of your files are on your pc/my documents so there needs to be much done with cleaning up there. Right now you have a conflict and I am not sure a browser will even read your css because of your html Hope this helps

Stu
Stu's picture
Offline
Enthusiast
Bristol uk
Last seen: 17 years 45 weeks ago
Bristol uk
Joined: 2004-01-20
Posts: 282
Points: 0

Layout Problems

Change ~
#centercontent
top:232px;

to

padding-top:232px;

But you do need to sort out your source code. You have so many repeated tags such as html, head and body that it is very confusing.

It's not what you do it's the way that you do it.
So do it with STYLE
http://www.s7u.co.uk

ivygirl
Offline
newbie
Last seen: 17 years 25 weeks ago
Joined: 2004-06-06
Posts: 4
Points: 0

Layout Problems

Thanks, I'll try the padding fix.

I know the code is pretty convoluted... I used a generator and then tried to modify from there and then with all the "fixes" I've tried, its pretty confusing.

The only reason I'm using CSS is because I'm also using php includes and couldn't figure out another way to keep the two column with header layout. I tried it without css and it threw the right column beneath my content. I'm a novice at php too so I thought css might be the best way to go.

I'll let you know how it turns out.

Thanks again,

Kate

ivygirl
Offline
newbie
Last seen: 17 years 25 weeks ago
Joined: 2004-06-06
Posts: 4
Points: 0

Layout Problems

Hi again,

I tried the padding fix-it didn't work.

One note though, if I take out the "position:absolute" for the header, my header stops lining up correctly (which was my original problem) but the content shows correctly (see the change at www.thewritingcafe.com). Any idea how to align the header without using the "position:absolute"? If so, that would fix both problems, I think.

Kate

Bigdawg
Offline
Enthusiast
Last seen: 17 years 50 weeks ago
Joined: 2003-12-16
Posts: 65
Points: 0

Layout Problems

CSS is definatly the way to go but if you define your fonts there you will not have to in your html!

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 6 years 46 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Layout Problems

Hi there,
just been looking at the site and find myself confused , am I missing something but how does your attached style sheet relate to the html; I can see no links to it in the header but then I am not used to frontpage ( used it once and ran a mile ) it does tend to throw a lot of propriatry code in which you will find won't validate.

I like the graphic but at 900px is a tad large from the point of view of 800/600 browsers they will loose the right hand links and have to scroll sideways for them!

I believe it's preferable to font size with px or ems rather than size=7 (deprecated?)

Your title ought to be in a h1 for semantic reasons and search engines will look for Heading tags and expect to find them; it will help in your pr.

To my mind if possible you want to ditch frontpage get a dtd at the top of the html and link to an external style sheet life will be easier.

Sorry if I have missed the point of your attached sheet but as Bigdawg said I'm not sure the css is having any part to play in the procedings as the html doesn't reference it and Firefox didn't find one for me to look at!
keep positive good luck,
Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me