Thread: Browser Alignment Question

I am having a recurring problem with my Picnic Basket site (http://www.wehavepicnicbaskets.com). It seems that depending on which browser you use, and which size monitor you have, my pages are displaying with everything in the centre, text and images, moved to the very far left and are covering up the navigation buttons.

I have tried everything to fix it, moved pictures and text, re-aligned everything on the page... and it is still doing it.

I do not understand html code very much and am very confused as to why this is happening. I have someone on IM that looked at it in their browser and it was moved to the left, than looked on their husbands laptop using Safari and it looked okay.

Has anyone experienced this before and fixed it? Or should I go to support on this issue?

Well, I see what you mean, but here is what I see. I am using IE7 and when I open up your home page everything came up just fine. Then I enlarged my browser window by pulling it to the right. When I did, your images in the middle stayed put and yet your background, text, nav menu, everything else moved to the right as it is suppose to. It almost looks like you've set your images somehow not to move? Then I went to your backpacks page and on that page everything in the middle, text and images stay put and yet the outside side menus and header move with the enlarging of my browser window. Hope that makes sense. I'm not sure what you would have done to set them that way, but maybe someone else will be by with the answer. In the meantime, I'll try and recreate what is happening on a test page and check back in a little bit.

Okay it finally let me log in here at work... Cindy sent an email saying that she was unable to recreate the situation on her Blue Voda but could not... so she knows that it is happening but does not know why.

I am also going to try and work on the html validation tomorrow to see if that helps at all... it may or it may not, either way it will answer some questions (and probably create more too! *LOL*)

In the meantime, if anyone else has any ideas of how it can be fixed, please try and help me out... if I have a site like this, I will never make sales on it! :(

Collectors Info took a look and he isn't sure whats happening here either. Suggested maybe Naval Design may know. Why don't you contact Naval through his contact form and ask if he'll take a look!

Cindy,

I made a change to my picnic basket page and locked all of the elements in place. A friend on another forum that I am on went and looked and it is doing the same thing still. I thought that might fix it but it did not.

I will try and contact Naval Design now. Do you think that I should put in a Voda support ticket on it? Would that help?

I would try and contact Naval first since it appears you are using a php script and I think Naval is the man for those types of scripts.

Cindy,

Thank you! I did fill out his form on his site on Sunday but have gotten no response yet.

I am using php as per his posting in the tips and tricks, it would not surprise me if it were something to do with that and he will find it. I had not thought of it being a php problem but maybe.... hopefully...... *LOL*

The page displays correctly in IE7, but pics are moved in Opera an FireFox.

Almost for sure, you have added or missed a tag in one of the scripts that you have added in your page, probably (but nit certain, your code id TOO long to examine it all) it could be your bookmark script

Well I will take a look tomorrow when I can get into BV and see if something is missing in the script. I will post it here too in case I miss something that is or is not there and should or should not be there!

Hi, is this happening on all pages or just 1or 2? It maybe worth taking one of your pages that has the problem, & rebuild that page as a basic BV page (Then test). Then introduce your scripts 1 by 1 with a test at each stage. Bit of a slow & painful way to do it. But should help the problem. Just hope its not a combination of 2 external scripts. LOL.
Chances are it will be a none BV part of the page that is creating the problem.

Good luck.
In saying all this! It looks fine in IE/FF set at 1024x768

I would suggest, instead, taking off the page, one at a time, the external scripts. So you will find which script causes the problem.
Remember: you need to check it in FF or Opera to see the problem.

Collectors,

Maybe I could do that too but I would have to get people on here to check it out because, as I said before, I do not see the troubles on my machines.

I know that when I did the bookmark script it was just copied for every page so if it one that is wrong, the rest will be as well. If that won't work, I will build a blank page, with header, footer etc and some products and text in the centre and see if it displays correctly. If it does, than it will narrow it down a bit along the way.

Naval,

The big problem is I have Firefox and IE 7 and they both display fine on both my desktop and my laptop, but others it won't!

So I went and checked the Bookmark this site script and it looked okay to me.. Here is what I have:

<A HREF="javascript:window.external.AddFavorite('http ://www.wehavepicnicbaskets.com','Wicker Picnic Baskets|Outdoor Recreation|Tailgating Supplies')">
<B>Bookmark Us!</B> </A></DIV>

That is from my homepage. I do not see anything missing but maybe you do???

Also, as per collectors suggestion, I created a straight html page http://www.wehavepicnicbaskets.com/htmltest.html maybe you could check it in your Opera and Firefox browser. Please let me know if it turned out okay because I am totally at a loss here cause it will not show up messed up here!

Your test page is fine for me in IE6 and FF .. however, when I increase the text size view in FF things are not okay .. so anyone viewing in larger text will have overlapping text ..

On your original pages for me, in IE6, the text is pushed over to the left, appears to be a margin justification problem ... maybe you need to set the size of the text area and placement ... Naval will likely figure out that for you ...

Just offering up my view ... Good Luck

I had difficulties with something similar to this the other day and it was because one item on the page did not have a closing tag and threw everything after it out of whack ...

I only have IE7, and my text size is set to medium in my browser.

Your htmltest page is PERFECT for me now. When I have the browser window to the far left of my screen and stretch it to the right, EVERYTHING moves in unison the way it should.

When I go to your original home page and have my browser window to the far left it is fine. However, the problem arises, when I stretch my browser window to the right, then your text and images overlap the left vertical menu.

Regardless, of which page I'm looking at, the text size doesn't seem to make a difference. I changed it to large and smallest and it still behaves the same way. Hope this helps!

Originally Posted by coffeegourmet

Naval,

The big problem is I have Firefox and IE 7 and they both display fine on both my desktop and my laptop, but others it won't!

So I went and checked the Bookmark this site script and it looked okay to me.. Here is what I have:

<A HREF="javascript:window.external.AddFavorite('http ://www.wehavepicnicbaskets.com','Wicker Picnic Baskets|Outdoor Recreation|Tailgating Supplies')">
<B>Bookmark Us!</B> </A></DIV>

That is from my homepage. I do not see anything missing but maybe you do???

Also, as per collectors suggestion, I created a straight html page http://www.wehavepicnicbaskets.com/htmltest.html maybe you could check it in your Opera and Firefox browser. Please let me know if it turned out okay because I am totally at a loss here cause it will not show up messed up here!

Delete the </DIV> from the bookmark code. There is no corresponding <DIV> tag. So, this one, is closing some other, previously defined div. Let me know when you are done.

Your test page is ok, probably because you have exluded the bookmark script. However, i would have excluded one script at a time, to see which is the guilty one. Try what i suggested and we will see.

Okay I went in and fixed the bookmark code on my index page so that it can be checked. I have already published it. I am now working my way through alphabetically to change all of the codes. I just wondered if someone could view it and see if it fixed it or not, than we know where we are at in things!

Thanks again!
http://www.wehavepicnicbaskets.com

YOU DID IT!! WORKS GREAT NOW! No overlapping on my end!

It worked? Cool! Okay I am deleting the other tags as we speak.

You did it!

No I cannot, and will not, take credit for it. It was Naval Design who noticed the extra code in there. I looked at it this morning when I got home and did not see that it did not belong in there.

Funny how that would mess up a page so bad!

Naval is the Man!! I think everyone on this forum that has been here awhile knows that. He has helped me out a lot in the past. Ok, maybe you won't take credit, however, you have been patient with the process, followed forum protocol and have been pleasent to try and help. Thank you for that. Hopefully others will come back and confirm that your site is all ok in other browsers as well.

Cool. Problem solved both in FF and Opera. Congratulations!!

Problem solved and big thanks to you! I am new to this html, php etc... and never noticed that the tag was not supposed to be there!

I have now fixed it on every page so I should be good to go! In the future I will make sure I use the proper code for bookmarking!

Now.... one more thing Naval,since you know this stuff well!

Can you have a quick look at my coffee site.. and maybe tell me why the scroll is so choppy on it. It does not do it on my picnic site, just this one... and I am clueless as to why!

I am learning bit by bit though!

Choppy ?

Yeah when you scroll up and down.... it looks like it is trying to play catch up! You will see when you look at it.

Well, i can see that the browser delays a bit to redraw the screen, but that is normal with all that content. At least i believe so.