List Info

Thread: Centering help!




Centering help!
country flaguser name
United States
2007-02-25 06:57:19
I know im asking a tricky question, ive read everywhere on
the internet how
centering using css can be somewhat hard...ive found some
things, and ive found
those things useful, however the cant fully help me.

Basically ive got an div layer containing just an image, i
want it to be
centered horizontally, however i want it 270px from the top
of the page
aswell...the coding im using now does everything but make it
absolutely centered
horizontally..its just slightly off.

The code im using at the moment (ive added asterisks as i
was sure if the code
will 'work' rather than just show as text) - 

<*style>table table {margin-top:270px;}
div table table, table table table {margin-top:0;}
...banner {width:700px; height:100px; position:absolute;
top:190px; left:50%;
margin-left:-370px; text-align:center;}</style*>

<*div class="banner">
<*img
src="http://i138.photobuck
et.com/albums/q246/xprincesssammiix/dk%20theme/bigbanner.jpg
">
</div*>

Just for curiousity, its a myspace page (i probably shouldnt
be asking for help
here, however ive always found answers i need from this
website...disregarding
this post of course.)

http://www.m
yspace.com/xprincess_sammiix

And of course, being myspace, you need to have things like
"div table table,
table table table" in your css to make things work. I
dont know why.

Any help would be VERY much appreciated. Ive spent weeks
racking my brains on
this one.

Samantha.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~|
Create Web Applications With ColdFusion MX7 & Flex 2. 
Build powerful, scalable RIAs. Free Trial
http:
//www.adobe.com/products/coldfusion/flex2/

Archive: http://www.houseoffusion.com/groups/CSS/messag
e.cfm/messageid:3650
Subscription: http://www.houseoffusion.com/groups/CSS/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/u
nsubscribe.cfm?user=22184.15789.41

Re: Centering help!
country flaguser name
United States
2007-02-25 08:37:36
You want your margin-left to be exactly half your width, and
you don't need
a margin-top.

Try this:
 position: absolute;
 top: 270px; left: 50%;
 height: 100px; width: 700px;
 margin: 0px; padding: 0px;
 margin-left: -350px;


On 2/25/07, Samantha Browning <lil_metallica_psychohotmail.com> wrote:
>
> I know im asking a tricky question, ive read everywhere
on the internet
> how
> centering using css can be somewhat hard...ive found
some things, and ive
> found
> those things useful, however the cant fully help me.
>
> Basically ive got an div layer containing just an
image, i want it to be
> centered horizontally, however i want it 270px from the
top of the page
> aswell...the coding im using now does everything but
make it absolutely
> centered
> horizontally..its just slightly off.
>
> The code im using at the moment (ive added asterisks as
i was sure if the
> code
> will 'work' rather than just show as text) -
>
> <*style>table table {margin-top:270px;}
> div table table, table table table {margin-top:0;}
> ...banner {width:700px; height:100px;
position:absolute; top:190px;
> left:50%;
> margin-left:-370px; text-align:center;}</style*>
>
> <*div class="banner">
> <*img
> src="
> http://i138.photobucket.com/alb
ums/q246/xprincesssammiix/dk%20theme/bigbanner.jpg
> ">
> </div*>
>
> Just for curiousity, its a myspace page (i probably
shouldnt be asking for
> help
> here, however ive always found answers i need from
this
> website...disregarding
> this post of course.)
>
> http://www.m
yspace.com/xprincess_sammiix
>
> And of course, being myspace, you need to have things
like "div table
> table,
> table table table" in your css to make things
work. I dont know why.
>
> Any help would be VERY much appreciated. Ive spent
weeks racking my brains
> on
> this one.
>
> Samantha.
>
> 

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~|
Create robust enterprise, web RIAs.
Upgrade & integrate Adobe Coldfusion MX7 with Flex 2
http:
//www.adobe.com/products/coldfusion/flex2/

Archive: http://www.houseoffusion.com/groups/CSS/messag
e.cfm/messageid:3651
Subscription: http://www.houseoffusion.com/groups/CSS/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/u
nsubscribe.cfm?user=22184.15789.41

Re: Centering help!
country flaguser name
United States
2007-02-25 07:41:22
Just wanted to clarify that where I wrote:
> You want your margin-left to be exactly half your
width
That is of course excluding the negative sign which must be
applied.


Oh, and also...

> being myspace, you need to have things like "div
table 
> table,
> table table table" in your css to make things
work. I dont know why.
Probably because of the horrific markup they use.

"div table table" all tables within tables within
divs.
"table table table" all tables within tables
within tables.
The comma seperator just means the style applies to both
identifiers.

A more useful example of when such syntax can be handy is
like this:
img {border: solid 1px black;}
a img, img.icon {border: none;}

So regular images will have a border around them, but images
within links or images with class="icon" will not
have a border applied.

Hope that makes sense? 



> I know im asking a tricky question, ive read everywhere
on the 
> internet how
> centering using css can be somewhat hard...ive found
some things, and 
> ive found
> those things useful, however the cant fully help me.
> 
> Basically ive got an div layer containing just an
image, i want it to 
> be
> centered horizontally, however i want it 270px from the
top of the 
> page
> aswell...the coding im using now does everything but
make it 
> absolutely centered
> horizontally..its just slightly off.
> 
> The code im using at the moment (ive added asterisks as
i was sure if 
> the code
> will 'work' rather than just show as text) - 
> 
> <*style>table table {margin-top:270px;}
> div table table, table table table {margin-top:0;}
...
> banner {width:700px; height:100px; position:absolute;
top:190px; 
> left:50%;
> margin-left:-370px; text-align:center;}</style*>
> 
> <*div class="banner">
> <*img
> src="http://i138.photobucket.

>
com/albums/q246/xprincesssammiix/dk%20theme/bigbanner.jpg&qu
ot;>
> </div*>
> 
> Just for curiousity, its a myspace page (i probably
shouldnt be asking 
> for help
> here, however ive always found answers i need from this
website...
> disregarding
> this post of course.)
> 
> http://www.m
yspace.com/xprincess_sammiix
> 
> And of course, being myspace, you need to have things
like "div table 
> table,
> table table table" in your css to make things
work. I dont know why.
> 
> Any help would be VERY much appreciated. Ive spent
weeks racking my 
> brains on
> this one.
> 
> Samantha.

~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
~~~~~~~~~|
ColdFusion MX7 and Flex 2 
Build sales & marketing dashboard RIA’s for your
business. Upgrade now
http:/
/www.adobe.com/products/coldfusion/flex2

Archive: http://www.houseoffusion.com/groups/CSS/messag
e.cfm/messageid:3652
Subscription: http://www.houseoffusion.com/groups/CSS/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/u
nsubscribe.cfm?user=22184.15789.41

[1-3]

about | contact  Other archives ( Real Estate discussion Medical topics )