Results 1 to 5 of 5

Thread: Positioning Error

  1. #1
    Join Date
    Aug 2006
    Location
    Ohio
    Posts
    266
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Positioning Error

    For some reason, on this page: http://resonant-media.com/client_work/atar/coding.html in IE 7, the large box with the picture is not positioned where it should be, but the position is correct in firefox. I can not seem to figure out what is causing the problem.

    The CSS code is located here: http://resonant-media.com/client_wor...main-style.css. I believe the error is on either line 15 (#main { ...) or 20 (#image { ...).

    Here is the code block for the section that is not positioning correctly:
    Code:
    				
    <div id="main">
    	<div id="image">
    		<div class="pic_border"><img src="images/pic_top.jpg" alt="" /></div>
    		<div id="pic"><img src="images/small_banner.jpg" alt="" /></div>
    		<div class="pic_border"><img src="images/pic_bottom.jpg" alt="" /></div>
    	</div>
    </div>
    Any help is much appreciated, thanks
    Thanks DD, you saved me countless times

  2. #2
    Join Date
    Oct 2006
    Posts
    92
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    ok what you might want it is

    Code:
    <div id="main"> 
          <div id="pic"> </div>
    </div>
    and css

    Code:
    #pic {
    
    width: ??
    height: ??
    border-top: size color url(images/pic_top.jpg);
    border-bottom: size color url(images/pic_bottom.jpg);
    }
    and use padding instead of a margin and make sure it adds up its simple maths

  3. #3
    Join Date
    Aug 2006
    Location
    Ohio
    Posts
    266
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Mehok View Post
    ok what you might want it is

    Code:
    <div id="main"> 
          <div id="pic"> </div>
    </div>
    and css

    Code:
    #pic {
    
    width: ??
    height: ??
    border-top: size color url(images/pic_top.jpg);
    border-bottom: size color url(images/pic_bottom.jpg);
    }
    and use padding instead of a margin and make sure it adds up its simple maths
    Well, I used padding instead of margin and it made no change. All the math adds up and the position is right in the code. For some reason, IE 7 has decided that it wants it moved about 200px to the right of where it should be. Firefox looks good and so does the dreamweaver preview mode, but IE 7 doesn't like it.

    Has anyone seen this error before?

    Thanks for the help
    Thanks DD, you saved me countless times

  4. #4
    Join Date
    Oct 2006
    Posts
    92
    Thanks
    6
    Thanked 0 Times in 0 Posts

    Default

    ok i might have figgured it out for you

    if you start with teh section of the page under the menu

    lets call it cnet

    css code
    Code:
    #cent {
    width: 780px;
    height: 600px;
    }
    
    .cent-left {
    width: ??;
    height: ??;
    float: left;
    }
    
    .cent-right {
    width: ??;
    height: ??;
    float: right;
    }
    HTML code
    Code:
    <div id="cnet">
    <div class="cnet-left">news and ****</div>
    <div class="cnet-right">image</div>
    </div>
    and make sire your page starts out with one main div box to contain where the div inside it can float all the way to if you know what i mean

    if you dont understand any of this please tell me so i can dumb it down a little

  5. #5
    Join Date
    Aug 2006
    Location
    Ohio
    Posts
    266
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Sorry for the late response, been pretty busy lately. I tried what you said, but I still get the same positioning error. I can not think of any reason for this at all. Any other suggestions?

    Thanks
    Thanks DD, you saved me countless times

Bookmarks

Posting Permissions

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