HighDots Forums  

floating in centered elements

Cascading Style Sheets Layout/presentation on the WWW (comp.infosystems.www.authoring.stylesheets)


Discuss floating in centered elements in the Cascading Style Sheets forum.



Reply
 
Thread Tools Display Modes
  #1  
Old   
yawnmoth
 
Posts: n/a

Default floating in centered elements - 02-11-2005 , 05:50 PM






The buy behind the csszengarden has a tutorial on how to center
absolutely positioned elements. Here's the last example:

http://www.mezzoblue.com/tests/centered-css/ex5.html

I've tried replacing the text with three divs of different colors
floated next to one another to no avail:

http://www.frostjedi.com/terra/dev/test.html

As can be seen, the vanilla colored box is duplicated (atleast in IE;
in firefox, it appears as a line). Also, when the content inside the
div that produces the vanilla colored box is floated left, the fact
that margin-left/right are set to auto seems to be ignored.

So any ideas as to how I can float content within divs that are both
centered and absolutely positioned?


Reply With Quote
  #2  
Old   
Lauri Raittila
 
Posts: n/a

Default Re: floating in centered elements - 02-11-2005 , 07:51 PM






in comp.infosystems.www.authoring.stylesheets, yawnmoth wrote:
Quote:
The buy behind the csszengarden has a tutorial on how to center
absolutely positioned elements. Here's the last example:

http://www.mezzoblue.com/tests/centered-css/ex5.html
Doesn't seem to work on Opera 8, don't know why.

Quote:
I've tried replacing the text with three divs of different colors
floated next to one another to no avail:

http://www.frostjedi.com/terra/dev/test.html

As can be seen, the vanilla colored box is duplicated (atleast in IE;
in firefox, it appears as a line).
Unfortunately I have no idea what you mean with vanilla color, but I
don't see anything.

Quote:
Also, when the content inside the
div that produces the vanilla colored box is floated left, the fact
that margin-left/right are set to auto seems to be ignored.

So any ideas as to how I can float content within divs that are both
centered and absolutely positioned?
Set positioned element (min-)width and (min-)height equal to float size.
Set it to display:table. Don't use float when you don't need it.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL.


Reply With Quote
  #3  
Old   
yawnmoth
 
Posts: n/a

Default Re: floating in centered elements - 02-12-2005 , 01:50 AM




Lauri Raittila wrote:
Quote:
in comp.infosystems.www.authoring.stylesheets, yawnmoth wrote:
snip
As can be seen, the vanilla colored box is duplicated (atleast in
IE;
in firefox, it appears as a line).

Unfortunately I have no idea what you mean with vanilla color, but I
don't see anything.
in opera, it appeared as a black line, but regardless, that problem has
been fixed.

Quote:
Also, when the content inside the
div that produces the vanilla colored box is floated left, the fact
that margin-left/right are set to auto seems to be ignored.

So any ideas as to how I can float content within divs that are
both
centered and absolutely positioned?

Set positioned element (min-)width and (min-)height equal to float
size.
Set it to display:table. Don't use float when you don't need it.
tried that, and it didn't work :

http://www.frostjedi.com/terra/dev/test2.html

although that said, i don't think the problem relates to floats,
anymore, so much as it does the fact that i'm simply using divs within
another div that's been both centered and absolutely positioned.



Reply With Quote
  #4  
Old   
Lauri Raittila
 
Posts: n/a

Default Re: floating in centered elements - 02-12-2005 , 05:14 AM



in comp.infosystems.www.authoring.stylesheets, yawnmoth wrote:

Quote:
tried that, and it didn't work :

http://www.frostjedi.com/terra/dev/test2.html

although that said, i don't think the problem relates to floats,
anymore, so much as it does the fact that i'm simply using divs within
another div that's been both centered and absolutely positioned.
Maybe, if you would describe what you wanted to see? It would be easier
to answer.

--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Utrecht, NL.


Reply With Quote
  #5  
Old   
TerraFrost
 
Posts: n/a

Default Re: floating in centered elements - 02-12-2005 , 01:23 PM



Lauri Raittila wrote:
Quote:
in comp.infosystems.www.authoring.stylesheets, yawnmoth wrote:

tried that, and it didn't work :

http://www.frostjedi.com/terra/dev/test2.html

although that said, i don't think the problem relates to floats,
anymore, so much as it does the fact that i'm simply using divs
within
another div that's been both centered and absolutely positioned.

Maybe, if you would describe what you wanted to see? It would be
easier
to answer.
i photoshopped an example of what i'd like:

http://www.frostjedi.com/terra/dev/test.jpg



Reply With Quote
Reply




Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off



Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.