Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Aug 2010
    Thanked 2 Times in 2 Posts

    center objects - one breaks on resize.

    I'm building a site where all the divs are positioned off a center point. It all works, with the images going off the page to the left when someone resizes their window width under the width of the image.

    But one image (center_left1.gif) stays anchored to the left of the browser window instead of staying off the screen, when the window is sized down small enough. Otherwise it does move with the others, though. (I hope that made sense) Here's what I've got so far:

    <? include("header.php"); ?>
    <div style="width: 820px; position:relative; left:50%; margin-left: -410px; background:url(images/center_top_stretch.gif) top left no-repeat;"><img src="images/center_top.gif" width="815"/></div>
    <div id="center">
    <!-- the div below is the one that won't slide with everything else -->
    <div style="height:0px; overflow:visible; width: 200px; position:relative; left:50%; margin-left: -440px; "><img src="images/center_left1.gif" /></div>
    <!-- end problem div -->
    <div style="width: 200px; height:1px; overflow:visible; position: relative; left:50%; margin-left:290px; top:0px; z-index:200;"><img src="images/center_right1.gif" /></div>
    <div style="text-align:left; position:relative; left:120px; z-index:100; width:590px; overflow:visible;">
    <p>text will go here<br><br>here here</p><br /><br /></div>
    <div id="footer">
    <? include("footer.php"); ?>

  • #2
    Senior Coder
    Join Date
    Aug 2010
    High Point, NC
    Thanked 363 Times in 360 Posts
    A link to your site? We dont have those images, so therefore can't recreate your page.

    But I would question why you need to use positioning for your elements.


    Posting Permissions

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