Can someone please help me figure out how to fix all of the alignment issues in IE?
I imagine that I need some conditional comments to load an alternative CSS file, but not sure what changes I can make to the CSS to get this working in IE as well.
In the index, the first 3 links in the nav are functional (I’ve Got Answers, Wine Director, Wine Snob). There are alignment issues on the index, along with throughout the 3 other pages. Disregard the other 4 navigation items for now—I do not have images and content there yet.
The links in the top right corner should all be functional.
Any help would be appreciated. An article came out about me yesterday, so I am rushing to get this up before traffic starts coming to the site! Thank you!
After reading through a lot of posts, you seem to be the right person to ask for help. Can you take a look at this for me?
Note to OP - It is bad etiquette to PM members asking for help especially when you have PM’d multiple members.
Members help out in the forums free of charge and should not be badgered into helping you. If you want paid help then visit the marketplace section of the forums.
I think we’ve helped all we can here so i’m closing the thread.
If you have new issues or have started a re-design and want help then please post a new thread but please don’t PM members to help you as that is against the guidelines.
unless you’re hitting the architectural graphics crowd, you’ll have to give up your idea of navigation that doesn’t scroll, because nobody’s got a screen that tall (well, it fits ok if I F11 to full-screen but I can’t actually browse that way : )
As noonnope said above you may need to re-think this a little as it won’t really be usable the way it is.
Fixed positioning is ok in small doses for things like a small header or footer but isn’t really suitable for anything that will go below the fold such as your side nav.
I would change that right nav into a horizontal nav across the top of the page and under the header (and make it a bit smaller). I’m sure it could be browser text rather than images anyway but if you are doing an image swap then use css and not masses of javascript.
Then your main text can run wider alongside your big image which could be fixed to the body as mentioned above. Set a margin-left on the content to keep it clear of the image.
I’m not sure what those image rollovers are for but they don’t do a lot for me. They would be better off on their own page.
Too much absolute positioning makes for a layout that is too rigid and unusable and you need to let pages flow a bit better.
I did actually try to revive your page but it wouldn’t come round
The issue with position:fixed is that I need the navigation div not to scroll out of view when the user is scrolling the page to read the additional text. Is there a way have the navigation div not scroll without the fixed position? Likewise, I have position fixed on the logo div and also the content in the upper right hand corner. This is because I want it all to stay there when scrolling the text that overflows the viewport. Do I have to give this up?
The scroll bars are present because I have a very tall black image set behind everything. The showcase images (triggered on and off by roll-over states in the navigation) do not cause an overflow, but when the page reverts back to text content there IS an overflow. This gives the viewport scroll bars and make my nav images jump back and forth about 20px. Forcing there to ALWAYS be scroll bars was the only way I could find to solve this issue.
You’re right about the jaycephoto. I can just set that to body background instead of another div.
What sort of positioning do I need to use? Just use relative? and give up my ability to have the navigation in a fixed position when scrolling?
[ot]the OP has suddenly grow on me, i respect him even more after seeing what RyanReese got!
talking about a man with a problem to solve. he actually has a play for each one of us! well, at least, he’s not cheap [/ot]
make a layout that works properly. you are trying to many things there.
start from a normal layout and work your way up to a different user experience. but start from a real user experience. so far your site its so confusing (frustrating would be the word) my cat wants to eat it
and if you want so bad that your picture be the center of attraction, use
body { background: url(“you.png”) fixed top left no-repeat; }
position:fixed is a bad option and solution. also the position: absolute. also, the scroll bars are present even when there is no content to overflow the viewport.
you think you have a good thing going over there with those. try making your browser window smaller and see how the content gets cut out top and bottom.
to start with: you have <div id=“jayce_photo”/> which is not needed. use the body background for that.
and make another layout that’s not based on fixed and absolute positioning
There is not any text in the middle in the index.html file. Go to the first link in the nav (I’ve Got Answers) which takes you to accred.html. That is the page that I took a screen shot of. The text is in the html document (but the opening copy, “Rumor has it…” is in image that is sourced in the html.
(sorry)