CSS Positioning

Discussion in 'CSS' started by g123s, Apr 3, 2009.

  1. #1
    Hi,

    I'm a newbie to CSS positioning, so please understand.

    How do you absolutely position a DIV tag within a DIV container?

    Thanks
     
    g123s, Apr 3, 2009 IP
  2. markupdude

    markupdude Peon

    Messages:
    215
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I am not sure if i understand exactly what you are trying to achieve, but here is what i guess of your requirement:

    <div id="outer" style="width:555px; height:333px;margin:20px auto; border:1px solid #000; background:#eee; position:relative;">
      
      <div id="inner" style="width:111px; height:111px; background:#ccc; position:absolute; bottom:10px; right:10px;">
        Some dummy content
      </div>   <!-- / Inner Block Ends -->
    
    </div>   <!-- / Outer Block Ends -->
    HTML:
    In the above code the position parts are what really matters.

    You give the Parent Container Position:Relative, and the Inner Child Element can have Position:Absolute; & Top/Bottom & Left/Right values to position it anywhere WITHIN that Parent element.

    Hope that solves your query :)
     
    markupdude, Apr 4, 2009 IP
  3. markupdude

    markupdude Peon

    Messages:
    215
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #3
    markupdude, Apr 4, 2009 IP