I can't figure out why one of my pages is out of alignment with the others. Please see this link:
http://www.jonzaremba.com
As you click on each of the links at the top (news, bio, music, photos, etc...) you'll see that the table containing the data is in the same place for all of the links except "bio". When you click on "bio", it will shift slightly to one side.
The URL for bio is http://www.jonzaremba.com/bio . That subdirectory has an index.htm file like the others.
Why is this particular page out of alignment from the others? The code looks the same to me... Or is it?
Thanks,
Jon Zaremba
One Page Out of Alignment with Others
jon
Trial User
6 posts
jon
Trial User
6 posts
Update:
I just noticed that this only happens in Firefox. If i switch over to IE (reluctantly) to test it out, the "bio" page is in line with the others.
Any ideas???
I just noticed that this only happens in Firefox. If i switch over to IE (reluctantly) to test it out, the "bio" page is in line with the others.
Any ideas???
BillR
Ambassador
3,144 posts
Jon,
Using Firefox 2.0.0.16, I see the left edge of text on three pages in the same location. Did you find the problem, or am I not seeing what you want us to see?
Using Firefox 2.0.0.16, I see the left edge of text on three pages in the same location. Did you find the problem, or am I not seeing what you want us to see?
jon
Trial User
6 posts
Bill,
Thanks for checking. I have the same version of Firefox as you and the "bio" page is definitely out of alignment from the others. That whole page (images, tables, text, etc) is about 5 pixels to the left which offsets it from the others.
Is it maybe just my computer???
Would you mind looking at it again?
Compare:
http://www.jonzaremba.com/bio/
To:
http://www.jonzaremba.com/
Thanks Again,
Jon Z.
Thanks for checking. I have the same version of Firefox as you and the "bio" page is definitely out of alignment from the others. That whole page (images, tables, text, etc) is about 5 pixels to the left which offsets it from the others.
Is it maybe just my computer???
Would you mind looking at it again?
Compare:
http://www.jonzaremba.com/bio/
To:
http://www.jonzaremba.com/
Thanks Again,
Jon Z.
BillR
Ambassador
3,144 posts
Jon,
Things have changed since I looked at it the first time. The first time everything was white, and now it is blue.
I don't have time to find the cause right now, but I will take a look again when I get home tonight.
Things have changed since I looked at it the first time. The first time everything was white, and now it is blue.
I don't have time to find the cause right now, but I will take a look again when I get home tonight.
jon
Trial User
6 posts
Thanks again. I just added some data to the "photos" link and now that one is out of whack too. I must be doing something wrong.
I definitely appreciate your help...
I definitely appreciate your help...
BillR
Ambassador
3,144 posts
Jon,
You are not using a valid DTD, and the beginning of each page I have checked starts with something like:
<b></b><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Start by removing that entire line and replace it with:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
That will provide you with a valid DTD, of the same type you are using, but this one will validate, and will not throw browsers into quirks mode.
I will continue to look through your code and get back to you sometime tomorrow.
You are not using a valid DTD, and the beginning of each page I have checked starts with something like:
<b></b><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Start by removing that entire line and replace it with:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
That will provide you with a valid DTD, of the same type you are using, but this one will validate, and will not throw browsers into quirks mode.
I will continue to look through your code and get back to you sometime tomorrow.
BillR
Ambassador
3,144 posts
Jon,
I can't see anything specific, but it appears that what is being seen is caused by the scroll bar appearing, and pushing the entire page slightly to the left. Here at work, I have IE6, and it has a scroll bar on the right at all times, so there is nothing to subtract from the width of the displayed area.
The only way I can think to keep this from happening would be to force Firefox to always have a scroll bar. I don't know of a way to code that, other than forcing the height of your web page to be greater than the height of my monitor (or someone with a 24" monitor).
I can't see anything specific, but it appears that what is being seen is caused by the scroll bar appearing, and pushing the entire page slightly to the left. Here at work, I have IE6, and it has a scroll bar on the right at all times, so there is nothing to subtract from the width of the displayed area.
The only way I can think to keep this from happening would be to force Firefox to always have a scroll bar. I don't know of a way to code that, other than forcing the height of your web page to be greater than the height of my monitor (or someone with a 24" monitor).
jon
Trial User
6 posts
Awesome responses! Thanks for your help, Bill. I changed the DTD as you suggested, but didn't notice a difference. So i added some text along the page to force a scroll bar. This helped to align everything except for the photos link.
http://www.jonzaremba.com/photos/
This page is still slightly off from the others. Any other ideas? It's not very drastic, so i can live with it like this if necessary...
Thanks Again,
Jon Z.
http://www.jonzaremba.com/photos/
This page is still slightly off from the others. Any other ideas? It's not very drastic, so i can live with it like this if necessary...
Thanks Again,
Jon Z.
BillR
Ambassador
3,144 posts
Jon,
Look at the top graphic for each page, paying attention to the right side. Notice that your photo page has a blue background that shows to the right of your graphic, but still inside the table. Also notice that the photo page table border is moving out on both sides, which is different from the other problem where the whole page was shifting left.
This line of code:
<table align="center" border="2" bordercolor="#ffffff" cellpadding="0" cellspacing="0" height="534" width="1011"> has a width of 1011, and your other pages have a width of 1000.
Change your photo page width to 1000, and that page should also align with the others.
Look at the top graphic for each page, paying attention to the right side. Notice that your photo page has a blue background that shows to the right of your graphic, but still inside the table. Also notice that the photo page table border is moving out on both sides, which is different from the other problem where the whole page was shifting left.
This line of code:
<table align="center" border="2" bordercolor="#ffffff" cellpadding="0" cellspacing="0" height="534" width="1011"> has a width of 1011, and your other pages have a width of 1000.
Change your photo page width to 1000, and that page should also align with the others.
Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.
