6 replies [Last post]
tray
tray's picture
Offline
newbie
milwaukee, wisconsin
Last seen: 16 years 37 weeks ago
milwaukee, wisconsin
Timezone: GMT-6
Joined: 2005-10-24
Posts: 3
Points: 0

hey everyone. i've checked this website on every mac browser i can find and it seems to have no problems. but i need it to also work on a windows pc... so could some people check it out in different browsers and let me know if there's something wrong with my code?

the webpage is at everymoment.org/1

here is a screen shot of what the page SHOULD look like:

the menu on the left side is supposed to remain fixed (111 px from the top, 331 px. from the left). and the background image also remains fixed (and that's a huge graphic.. i'm on a 30" monitor... i don't want it to repeat even for me Smile ). the picture at the top, the text below it and off to the right side should all scroll together with the page.

and here's all my code for the sucker: (in txt format)

the index file
the css file

thanks!

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 38 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

browser checks : everymoment dot org

You've got a few problems unfortunately. In FF, IE & Opera 8.5 you can see 'ent.org' moving over the text behind it as you scroll down the page. In IE, your menu appears at the bottom right of the document (ie out of site until you scroll to the bottom).
In all browsers, resizing to 800 x 600 gives you a horizontal scrollbar. Scrolling to the right produces undesirable results (see attachment).
Also, your text on the right is quite hard to read as it is (not enough contrast).

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

Anonymous
Anonymous's picture
Guru

browser checks : everymoment dot org

Tables for layout and non-valid code. *hrump*

[-(

Let's validate, validate, validate and dump the presentational markup. Smile

tray
tray's picture
Offline
newbie
milwaukee, wisconsin
Last seen: 16 years 37 weeks ago
milwaukee, wisconsin
Timezone: GMT-6
Joined: 2005-10-24
Posts: 3
Points: 0

browser checks : everymoment dot org

alright. so how do i fix this then?

Anonymous
Anonymous's picture
Guru

browser checks : everymoment dot org

tray wrote:
alright. so how do i fix this then?
The site sure is pretty. Smile

So, to "fix" it I'd make the menu an unordered list and since it is just text that changes colors you don't need them to be images you can use text with :hover rollovers.

Then validate the rest of the code: http://validator.w3.org/check?uri=http%3A%2F%2Fwww.everymoment.org%2F1%2F (this is a very small amount of work on this part). Just move the presentational attributes to the css file and add your alt text.

That will not only get you started it'll get you finished with this because it really does look great! Smile

tray
tray's picture
Offline
newbie
milwaukee, wisconsin
Last seen: 16 years 37 weeks ago
milwaukee, wisconsin
Timezone: GMT-6
Joined: 2005-10-24
Posts: 3
Points: 0

browser checks : everymoment dot org

thanks SO much for your help. i'll work on that. (and yea.. my website has had an old design on it for too long.. it's time to finish this one up! Smile )

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 7 years 38 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

browser checks : everymoment dot org

For your validation errors, move all this:

<body bgcolor="666633" background="images/bigoldbgimage1.jpg" text="#000000" link="660000" vlink="#660000" alink="#666633" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" class="this"> out of your HTML and into your CSS. No need to give it a class of .this, just reference it with body { .... Your layout breaks when resized because your menu is given a fixed position, but the rest of the layout is position: relative. Your problem in IE is that it doesn't support position: fixed for any element other than the body. Eric Meyer has done a demo on position: fixed which may help explain things. Tagsoup also have an article on workarounds for IE.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference