Velocity Reviews

Velocity Reviews (http://www.velocityreviews.com/forums/index.php)
-   HTML (http://www.velocityreviews.com/forums/f31-html.html)
-   -   div on side? (http://www.velocityreviews.com/forums/t164269-div-on-side.html)

Steve Kostecke 02-18-2006 05:33 PM

div on side?
 
Hello. I'm wondering, say I have a centered bit of content (and center
of screen, so probably 100% width for that div), like so

<div align="center" style="width: 100%">
Some content that's centered
</div>

How exactly does one add something aligned to the right but in the same
"row" or "line" if you will (the right align content is not under the
centered, but to the right of it, with the centered content still being
in center, and not pushed over or anything.

So it would come out something like this:

| Centered Content Right Aligned |


(And the right aligned needs to stay to always hug the right side, so
when the screen is resized its still the same amount of space from the
right, and the centered is still center of the screen.)

I know I might not be doing it all right so far, so any pointers an help
would be greatly appreciated.

(Also, what if I wanted to also throw in a left side section, that acts
like the right side, but for the left instead, would that require
anything special compared to how ever its done for the right side
section?)



David E. Ross 02-18-2006 05:58 PM

Re: div on side?
 
Steve Kostecke wrote:
> Hello. I'm wondering, say I have a centered bit of content (and center
> of screen, so probably 100% width for that div), like so
>
> <div align="center" style="width: 100%">
> Some content that's centered
> </div>
>
> How exactly does one add something aligned to the right but in the same
> "row" or "line" if you will (the right align content is not under the
> centered, but to the right of it, with the centered content still being
> in center, and not pushed over or anything.
>
> So it would come out something like this:
>
> | Centered Content Right Aligned |
>
>
> (And the right aligned needs to stay to always hug the right side, so
> when the screen is resized its still the same amount of space from the
> right, and the centered is still center of the screen.)
>
> I know I might not be doing it all right so far, so any pointers an help
> would be greatly appreciated.
>
> (Also, what if I wanted to also throw in a left side section, that acts
> like the right side, but for the left instead, would that require
> anything special compared to how ever its done for the right side
> section?)
>
>


Do you mean you want to create a right sidebar as in my home page? (See
the URL in my signature below.)

--

David E. Ross
<http://www.rossde.com/>

Stan McCann 02-18-2006 07:27 PM

Re: div on side?
 
"Steve Kostecke" <spamtrap@ntp.isc.org> wrote in
news:45p43vF7rucfU1@individual.net:

> Hello. I'm wondering, say I have a centered bit of content (and
> center of screen, so probably 100% width for that div), like so
>
> <div align="center" style="width: 100%">
> Some content that's centered
> </div>
>
> How exactly does one add something aligned to the right but in the
> same "row" or "line" if you will (the right align content is not
> under the centered, but to the right of it, with the centered
> content still being in center, and not pushed over or anything.
>
> So it would come out something like this:
>
>| Centered Content Right Aligned |


See http://www.w3.org/TR/CSS21/visuren.html#propdef-float. Enclose
your right side content in an appropriate element and style that
element to float to the right. It will then hug the right margin.
Apply left instead of right for left side.

http://alamo.nmsu.edu/catalog/ shows an old example (scroll down). I
hadn't visited that page in quite some time. Looks like it needs some
work again (I'll do it in the site revision I'm in the process of).

--
Stan McCann, "Uncle Pirate" http://stanmccann.us/
Webmaster, NMSU at Alamogordo http://alamo.nmsu.edu/
Now blocking Google Grouper posts and replies.
http://blinkynet.net/comp/uip5.html

Jim Moe 02-18-2006 08:49 PM

Re: div on side?
 
Steve Kostecke wrote:
>
> <div align="center" style="width: 100%">
> Some content that's centered
> </div>
>
> How exactly does one add something aligned to the right but in the same
> "row" or "line" if you will (the right align content is not under the
> centered, but to the right of it, with the centered content still being
> in center, and not pushed over or anything.
>
> So it would come out something like this:
>
> | Centered Content Right Aligned |
>

<div align="center" style="width: 100%">
<span style="float:right">Right Aligned</span>
Some content that's centered
</div>

or

<div align="center" style="width: 100%">
<span style="position: absolute; right: 2em;">Right Aligned</span>
Some content that's centered
</div>

or

<div align="center" style="width: 100%">
<div style="position: absolute; right: 2em; width: 10em">Right Aligned</div>
Some content that's centered
</div>

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

knoxautoguy 02-21-2006 04:41 PM

Re: div on side?
 
I have done a similar thing with CSS. The same principle should hold
in HTML. Just align your text left -n% or right-n% to get it to one
side or the other of the centered content. For example, I have "top of
page" at various places linked to an anchor at, surprisingly enough,
the top of the page. You may have to use display and absolute
positioning. I have enclosed it in a <span> and then coded the css
file like this:
span.topofpage {
display: block;
position: absolute;
right: -20%;
}
This places my "top of page" links off to the right of the centered
content, which is also positioned absolutely by using similar code.
Whether this is the RIGHT way or not, I don't know; but it works for me.



All times are GMT. The time now is 10:42 PM.

Powered by vBulletin®. Copyright ©2000 - 2014, vBulletin Solutions, Inc.
SEO by vBSEO ©2010, Crawlability, Inc.