Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Mar 2012
    Posts
    19
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Place object X pixels from center

    I have a fixed object that I'd like to place just outside of my centered layout. I know I can use Left and Right position but with variable screen sizes, this leads to inconsistency. Is there a position command that starts at 50% horizontal (center) and then can be set a certain amount of pixels outside of it?

    Maybe I'm making this too complicated, but I was thinking about a Div within a Div -- the first Div is Right: 50%, the second Div is XXX pixels so that it hovers just outside the layout.

  • #2
    Senior Coder
    Join Date
    Aug 2006
    Posts
    1,343
    Thanks
    11
    Thanked 288 Times in 287 Posts
    Typically this is done with a negative left margin:
    Code:
    <!DOCTYPE html>
    <html>
    
    <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
    <title>Untitled 1</title>
    </head>
    
    <body>
    <div style="width:500px;margin:0 auto;border:1px green solid">
    	<p>centered: sh dflksj hflskjh fsldkjh fslkjf hslkjf hslkjfh slkjfh sldkjf lskf lsjf</p>
    	<div style="width:200px;margin:0 auto;margin-left:-200px;border:1px red solid">
    		<p>inside kla dkj lkjh asdlfkjd shlfkjh sldkjfh sldkjf</p>
    	</div>
    </div>
    </body>
    
    </html>
    Dave

  • Users who have thanked tracknut for this post:

    bswb97 (07-26-2012)

  • #3
    Senior Coder
    Join Date
    Jun 2008
    Location
    New Jersey
    Posts
    2,537
    Thanks
    45
    Thanked 259 Times in 256 Posts
    bare in mind, this does require knowing the width of the items... if you're trying to position an item but don't know how wide it'll be, you can't do what you're mentioning. Javascript is a way though to allow you to figure out the width of a variable item and center it, if you wanna go that way.

  • #4
    New Coder
    Join Date
    Mar 2012
    Posts
    19
    Thanks
    3
    Thanked 0 Times in 0 Posts
    The margin trick worked. Thanks!


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •