Riding the Right (Edge That Is)

**Beauregard T. Shagnasty** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

Quoth the raven named Heath:
[color=blue]
> I have an image in a header defined by a div. It is organized in
> the way that I was shown here, that is the contents of the div
> (three images) are aligned to the left using text-align: left; and
> first image is flush on the left, second image is has a left margin
> of 50px. The third doesn't matter for now.
>
> The question: Is there a way to keep the second image flush with
> the right side of the *browser window*?[/color]

I, and others, answered this question in your "Centering image"
thread. The response from me was snipped right from a working web page
with three logo images, one flush left, one larger in the center, and
a duplicate of the left one at flush right.

I'd give you a URL, but the page/site is in negotiation with a
prospective client.
[color=blue]
> The body of the document is 2000px so I can't use the body.[/color]

The body is 2000px? What do you mean?
[color=blue]
> Here is what I was thinking: wrap the fist and second image in
> another div and size it to 100% then float the second image to the
> right.
>
> That seemed inefficient to me. Does anyone else know how to do
> this, maybe using margins or padding or something else?[/color]

Again, see the answers in the other thread.

--
-bts
-This space intentionally left blank.

**Beauregard T. Shagnasty** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

Beauregard T. Shagnasty replied to hisself:
[color=blue]
> I'd give you a URL, but the page/site is in negotiation with a
> prospective client.[/color]

Ok, I cut the relevant parts to this page. I didn't bother taking the
time to find a suitable graphic for the center.

403 Forbidden

http://home.rochester.rr.com/bshagnasty/banner.html

--
-bts
-This space intentionally left blank.

**Heath** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

(snip)
[color=blue]
> I, and others, answered this question in your "Centering image" thread.
> The response from me was snipped right from a working web page with
> three logo images, one flush left, one larger in the center, and a
> duplicate of the left one at flush right.[/color]

You (and others) answered a different question. The difference is that
the page is 2000px wide (because of a table, which unfortunately there
is no way around it) so using your technique I was able to do as you
illustrated.
[color=blue]
> I'd give you a URL, but the page/site is in negotiation with a
> prospective client.
>
> The body is 2000px? What do you mean?[/color]
2000px wide

(snip)[color=blue]
> Again, see the answers in the other thread.[/color]

What I am looking for is different because of the size of the page. I
see how you misunderstood what I was asking, I wasn't very clear.

Here is the code:

<html>
<style>
#identityBox {
text-align: center;

***width: 2050px;***
}

#adOne {float: left;}

#adTwo {float: right;}

</style>
<body>
<div id="identityBox ">
<img src="Game_files/ads/Banner.gif" id="adOne" />
<img src="Game_files/ads/Banner.gif" id="adTwo" />
<img src="Game_files/images/identity.jpg" id="identity" />
</div>
</body>
</html>

The question is: Is there a way to always keep the identity image
visible regardless of how the user resizes the window. With the page
being so wide, this code won't do it.

Any suggestions?

**Beauregard T. Shagnasty** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

Quoth the raven named Heath:
[color=blue]
> (snip)
>[color=green]
>> I, and others, answered this question in your "Centering image"
>> thread. The response from me was snipped right from a working web
>> page with three logo images, one flush left, one larger in the
>> center, and a duplicate of the left one at flush right.[/color]
>
> You (and others) answered a different question. The difference is
> that the page is 2000px wide (because of a table, which
> unfortunately there is no way around it) so using your technique I
> was able to do as you illustrated.[/color]

What kind of data is this? Could it be rearranged in vertical display
instead?
[color=blue][color=green]
>> I'd give you a URL, but the page/site is in negotiation with a
>> prospective client.
>>
>> The body is 2000px? What do you mean?[/color]
>
> 2000px wide
>
> (snip)
>[color=green]
>> Again, see the answers in the other thread.[/color]
>
>
> What I am looking for is different because of the size of the page.
> I see how you misunderstood what I was asking, I wasn't very clear.[/color]

Reading over the other thread, I didn't catch anyplace where you said
you wanted the left and right images to remain in the browser window
instead of /off-screen/. You said:

Oops:
-----------------------------------------
||------| |-------|
||image | My Logo.jpg | image |
||------| |-------|
-----------------------------------------

...which my example illustrates.

<snip code>[color=blue]
> The question is: Is there a way to always keep the identity image
> visible regardless of how the user resizes the window. With the
> page being so wide, this code won't do it.
>
> Any suggestions?[/color]

If you want the side images to float within the visible portion of a
super-wide page, you'll need to resort to some sort of JavaScript
trickery.

--
-bts
-This space intentionally left blank.

**Heath** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

(snip)[color=blue]
> What kind of data is this? Could it be rearranged in vertical display
> instead?[/color]

It's a super fat table
[color=blue][color=green]
>> (snip)
>>[/color]
>
> ..which my example illustrates.[/color]

perfectly. Merci Beaucoup

(sorry I have different pages the obese page and a thinner pop-up)[color=blue]
>
> <snip code>
> If you want the side images to float within the visible portion of a
> super-wide page, you'll need to resort to some sort of JavaScript trickery.[/color]

Thank you for helping know how to say that. I was hoping that there
would be a css way.

When sizing a box using % does it always reference its' container. Or is
there a way to reference the visible window?

**Lauri Raittila** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

In article Heath wrote:[color=blue]
> (snip)
>[color=green]
> > I, and others, answered this question in your "Centering image" thread.
> > The response from me was snipped right from a working web page with
> > three logo images, one flush left, one larger in the center, and a
> > duplicate of the left one at flush right.[/color]
>
> You (and others) answered a different question. The difference is that
> the page is 2000px wide (because of a table, which unfortunately there
> is no way around it) so using your technique I was able to do as you
> illustrated.[/color]

URL? If I change paragraph in B.T.S. example to be 2000px wide, it works
exactly that way.

So it seems some stupid table layout, so there certainly is way around
it.
[color=blue]
> What I am looking for is different because of the size of the page. I
> see how you misunderstood what I was asking, I wasn't very clear.
>
> Here is the code:
>
> <html>
> <style>
> #identityBox {
> text-align: center;
>
> ***width: 2050px;***
> }[/color]

Why you need exactly this box be that wide? It seems to be exact opposite
of what you ask.
[color=blue]
> #adOne {float: left;}
>
> #adTwo {float: right;}
>
> </style>
> <body>
> <div id="identityBox ">
> <img src="Game_files/ads/Banner.gif" id="adOne" />
> <img src="Game_files/ads/Banner.gif" id="adTwo" />
> <img src="Game_files/images/identity.jpg" id="identity" />
> </div>
> </body>
> </html>
>
> The question is: Is there a way to always keep the identity image
> visible regardless of how the user resizes the window. With the page
> being so wide, this code won't do it.[/color]

If the page has something that wide, that is not problem. If the
container is that wide, there is no way.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Saapi lähettää meiliä, jos aihe ei liity ryhmään, tai on yksityinen
tjsp., mutta älä lähetä samaa viestiä meilitse ja ryhmään.

**Beauregard T. Shagnasty** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

Quoth the raven named Lauri Raittila:

I think we are all confused, including Heath. <g>
[color=blue]
> In article Heath wrote:
>[color=green]
>>(snip)[/color][/color]

<moresnip>[color=blue]
> URL? If I change paragraph in B.T.S. example to be 2000px wide, it works
> exactly that way.[/color]

See update:

403 Forbidden

http://home.rochester.rr.com/bshagnasty/banner.html

Heath: pick your poison.

I put a width on a second set of logos, and on one paragraph which
would be equal to your obese table.

Now, if you tell us you want that right logo /always/ at the same
position near the browser's right side regardless of horizontal
scrolling, then you will need the js trickery. And js may not be
available in your visitor's browser.

I don't see any particular need for it, though. Let the visitor scroll
the table and don't worry about the rest. Assuming this is valid
tabular data that can't be compressed, there is nothing wrong with
having the rest of the pieces and parts statically positioned.

--
-bts
-This space intentionally left blank.

**Heath** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

>>> (snip)
[color=blue]
> See update:
> http://home.rochester.rr.com/bshagnasty/banner.html
>
> Heath: pick your poison.
>
> I put a width on a second set of logos, and on one paragraph which would
> be equal to your obese table.
>
> Now, if you tell us you want that right logo /always/ at the same
> position near the browser's right side regardless of horizontal
> scrolling, then you will need the js trickery. And js may not be
> available in your visitor's browser.[/color]

This is what I want. Unfortunately my page is so overridden with js that
even to get to my obese table you have to be able to use js. I make it
clear from my home page that my site is completely dependent on js so
this is an option (though I would rather not use it except for where
completely necessary).
[color=blue]
>
> I don't see any particular need for it, though. Let the visitor scroll
> the table and don't worry about the rest. Assuming this is valid tabular
> data that can't be compressed, there is nothing wrong with having the
> rest of the pieces and parts statically positioned.[/color]

This is a good point. I am glad there are other people to bounce my
ideas off of. I think that I will do it like this. I guess where it is
already a fixed width it won't kill anyone (except the advertisers) if
the pieces are fixed. Otherwise its more js.

Thanks for your thoughts and I am going to summarize by saying that if I
want an image to /always/ be at the same position near the browser's
right side regardless of horizontal scrolling it isn't possible with
css, instead I should use java script.

Thanks for all your help.

Heath

**Neal** · Jul 20 '05, 09:15 PM

Re: Riding the Right (Edge That Is)

"Heath" <hjweaver@email .moc> wrote in message
news:3ffb3388$0 $1155$ba620e4c@ news.skynet.be. ..[color=blue]
> Thanks for your thoughts and I am going to summarize by saying[/color]
that if I[color=blue]
> want an image to /always/ be at the same position near the[/color]
browser's[color=blue]
> right side regardless of horizontal scrolling it isn't possible[/color]
with[color=blue]
> css, instead I should use java script.[/color]

If IE is not going to be used, you could use fixed positioning.
But likely it will be.

Riding the Right (Edge That Is)

Riding the Right (Edge That Is)

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment

Comment