Re: My Text Moves Position Depending on the Browser IUse -
12-09-2007
, 02:10 AM
Hello,
The reason is this:
</table>
<p> </p>
<p> </p>
<p> </p>
<table width="139" border="0" cellpadding="0" cellspacing="0">
You are using <p> tags to control spacing in your layout.
You have the table that contains your rollover images spaced 3 paragraphs
from the top table.
The trouble is, the paragraphs have different default margins in different
browsers. This is why you have the alignment issue.
Normally, you would use CSS to give all the <p> tags the same margin to give
lines of text the same spacing cross browser.
However, that won't help here because users have different text sizes in
their browsers. Different text sizes means different line height.
In browsers with text view set to "big text" your table with the images
will have a lot of space between it and the top table. In browsers with
small text, the table will be much closer to the top table.
All the while, your AP divs will stay in the same place on the page.
The text will only line upo ver the images for those people who have their
text size set exactly the same as yours.
This is why you shouldn't use <p> tags to control spacing between objects when
graphically the
objects must be in a specific place in the layout.
The solution is to get rid of the <p> tags and use CSS to give the table
with the rollover images in it a top margin.
First, get rid of the <p> tags and give the table below them a CSS class.
Change this:
</table>
<p> </p>
<p> </p>
<p> </p>
<table width="139" border="0" cellpadding="0" cellspacing="0">
To this:
</table>
<table width="139" border="0" cellpadding="0" cellspacing="0"
class="leftnav">
Then, define the class in your CSS. You can add it at the end, right after
your a:active link style:
Change this:
a:active {
text-decoration: none;
}
-->
</style>
To this:
a:active {
text-decoration: none;
}
.leftnav {
margin-top:150px;
}
-->
</style>
Adjust the margin as desired to line the table with the images up with your
AP divs.
I hope this helped.
Take care,
Tim |