| Author |
Move last span to the right side
|
|
| Rick Brandt 2007-04-27, 6:17 pm |
| Sorry, I don't have a sample web page, but hopefully the crude illustration
below will suffice.
Given that the space within the dashed upper and lower lines is a div across the
entire width of the page and that the [-tab-] areas are spans that sit on the
left side of that div, is there a simple CSS way to make the "additional span"
be justified to the right side of the containing div?
I have been experimenting with different strategies and they all seem to have
major flaws (or not work at all). Many screw up the layout of the divs below
and using margins and such doesn't seem to get me anywhere without using
hard-coded widths on the elements.
---------------------------------------------------------------
[---tab---] [-tab-] [--tab--] [-tab-] (additional span)
---------------------------------------------------------------
(more divs in rest of page follow)
TIA
| |
|
| On 2007-04-27, Rick Brandt <rickbrandt2@hotmail.com> wrote:
> Sorry, I don't have a sample web page, but hopefully the crude
> illustration below will suffice.
>
> Given that the space within the dashed upper and lower lines is a div
> across the entire width of the page and that the [-tab-] areas are
> spans that sit on the left side of that div, is there a simple CSS way
> to make the "additional span" be justified to the right side of the
> containing div?
float: right
> I have been experimenting with different strategies and they all seem
> to have major flaws (or not work at all). Many screw up the layout of
> the divs below and using margins and such doesn't seem to get me
> anywhere without using hard-coded widths on the elements.
We do need a URL or a better explanation to help with that kind of
thing.
> ---------------------------------------------------------------
> [---tab---] [-tab-] [--tab--] [-tab-] (additional span)
> ---------------------------------------------------------------
> (more divs in rest of page follow)
>
> TIA
>
>
| |
| Rick Brandt 2007-04-27, 6:17 pm |
| Ben C wrote:
> On 2007-04-27, Rick Brandt <rickbrandt2@hotmail.com> wrote:
>
> float: right
Float right gave me...
---------------------------------------------------------------
[---tab---] [-tab-] [--tab--] [-tab-]
---------------------------------------------------------------
(additional span)
....and often the content after the floated span would end up off to the
right and off-screen. I am now using...
position: absolute;
right: 3px;
....and that is working pretty well. I didn't realize that absolute doesn't
affect the vertical position if you don't specify a top setting.
> We do need a URL or a better explanation to help with that kind of
> thing.
Sorry, I am on an intranet with no access to a public site.
| |
|
| On 2007-04-27, Rick Brandt <rickbrandt2@hotmail.com> wrote:
> Ben C wrote:
>
> Float right gave me...
> ---------------------------------------------------------------
> [---tab---] [-tab-] [--tab--] [-tab-]
> ---------------------------------------------------------------
> (additional span)
>
> ...and often the content after the floated span would end up off to the
> right and off-screen.
Yes that's a bug shared by both FF and IE7 ^H^H^H^H^H new de facto
standard.
The fix is to put the floated span _first_ in the content before any of
the [--tab--]s.
> I am now using...
>
> position: absolute;
> right: 3px;
>
> ...and that is working pretty well. I didn't realize that absolute doesn't
> affect the vertical position if you don't specify a top setting.
That's right, although you are relying on a part of the spec that says
that browsers are "free to make a guess" at that position. Safer to
specify top if you can.
| |
| Rick Brandt 2007-04-27, 6:17 pm |
| Ben C wrote:
> Yes that's a bug shared by both FF and IE7 ^H^H^H^H^H new de facto
> standard.
>
> The fix is to put the floated span _first_ in the content before any
> of the [--tab--]s.
Thanks; I'll do some testing with that.
|
|
|
|
| Copyright 2003 - 2008 forum4designers.com Software forum Computer Hardware reviews |