Positioning: Centering with unknown/fulid width., Strict / Relative |
Positioning: Centering with unknown/fulid width., Strict / Relative |
Barons |
Feb 22 2011, 02:35 PM
Post
#1
|
Member Group: Members Posts: 70 Joined: 7-November 10 Member No.: 13,091 |
I would like my content box expand and shrink with the text inside of it. My issues is getting it to center as well.
My content box appears to be positioned relative to the home button and that's causing it to move off center. I'm not sure why its tied into the home button. It most have something to do with the way I'm displaying my content with the on-hover effect. The right side of the content box is the only side that moves when the box expands or shrinks. The left side stays in the same place in line with the home button. If I changed the code below to positioned strict that "should" make it its own entity correct? Then I would plug in my width and my margin autos and it "should" be center right? http://www.wararmada.com/tdb/test.php CODE #contentBox ul ul li { border:#000 solid; border-width:1px; -moz-border-radius: 1em; -webkit-border-radius: 1em; border-radius:1em; max-width:700px; width:auto; padding:10px; position:strict; margin-top:50px; color:#F0F0F0; background-color: rgba(255,0,0,0.3); } It doesn't, its still aligned with the home button. It seems like position strict would break the connection to the home key. Is that how it would normaly work? If so this could be a side effect of the way I've got the content to display on hover. I guess technically my content box is inside of the nav bar. They are just hover text that I've added some style to and then a bit of javascript to keep it from closing when you take your mouse off the button. I could make it would if the middle of the content box was the anchor point but its not its the far left side. I'm just getting my feet wet with positioning. Relitive makes it move within its parent div and Strict should make allow it to move freely as far as i know? I'm not sure what it's not working. Seems like no matter what I do the content box is still tied into the home button. I've also tried http://www.wararmada.com/tdb/test2.php CODE #contentBox ul ul li { width: 75%; max-width:700px; margin: 50px 0 0 25%; padding:10px; border:#000 solid; border-width:1px; -moz-border-radius: 1em; -webkit-border-radius: 1em; border-radius:1em; color:#F0F0F0; background-color: rgba(255,0,0,0.3); } Any idea on how I can get around this? It could just be that I'm not very good with css. |
Lo-Fi Version | Time is now: 24th April 2024 - 03:30 PM |