|
|
Posted by Ben C on 02/03/07 09:30
On 2007-01-31, Remy <rblaettler@hotmail.com> wrote:
> Thanks a lot for the hints.
> I'm aware that tables are not the best solution, but that is part of
> the page as it is now. Working on changing that.
>
> Now, I cannot add the image to the <div class="panelHeaderContent">
> part, because the idea of the image is that it has a little corner
> that is transparent. If it is in the div, the background shines
> through and the intended effect is gone.
>
> I've changes everything according to your suggestions, but it still
> looks off in firefox and in IE too if I don't have the End text.
> I copied it to my test server:
>
> 206.196.24.4/supertext/util/test.htm (just add the http://)
>
> You can see that in Firefox the first one is on two lines, and in the
> second one, the background does not go all the way.
> What else am I missing?
This is an interesting case, and I think Firefox is wrong.
My earlier reply was mistaken, because I failed to observe that
..panelHeaderContent was floated.
The question is the width of .panelHeaderContent. It's an auto-width
left float containing a left float and a right float. Its computed width
should be the sum of the widths of its contents, much less than 290px in
most default fonts, so there should be plenty of room for
..panelHeaderContent on the same line as .panelHeader.
Anyway, FF seems to float the right float in .panelHeaderContent all the
way to the right of the 300px container (the <td>), making the computed
width of .panelHeaderContent 300px. I can see no justification for that.
Opera and Konqueror both get it right. But "right" isn't the effect you
want, since you want "End" at the right of the <td> presumably.
Your problem is easily fixed though if you just add width:290px to the
selector for .panelHeaderContent. The container is 300px and the image
is 10px, so you know that width needs to be 290px.
Navigation:
[Reply to this message]
|