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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Weird spaces between divs

    I can't begin to explain why.

    With spaces:
    Code:
    <div id="content">
    <!-- End template File: header.php -->
    
    <!-- Begin template File: index.php -->
    <div id="greenspace">
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png"></div>
    </div>
    </div>
    Without:
    Code:
    <div id="content"><div id="greenspace">
    <!-- End template File: header.php -->
    
    <!-- Begin template File: index.php -->
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png"></div>
    </div>
    </div>
    Line break (before content)
    Code:
    <!-- End template File: header.php -->
    
    <!-- Begin template File: index.php -->
    <div id="content"><div id="greenspace">
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png"></div>
    </div>
    </div>
    Now for the weird one... line break in this one (two files, comment processing removed):
    Code:
    <div id="content"><div id="greenspace">
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png" /></div>
    </div>
    And even weirder:
    Code:
    <div id="content">
    <!-- End template File: header.php -->
    
    <!-- Begin template File: index.php -->
    test<div id="greenspace">
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png"></div>
    </div>
    </div>
    "test" shows up in the gap between the two divs.

    I simply cannot explain why.

    Now, As you can probably tell by the comments, these are PHP scripts combining together... but this is a browser behavior issue, any ideas?

    The space is just a blank text line, I could do a top:-22px; hard code, but different sizes of text messes that up.


    Edit:
    heh, because #content doesn't hold direct content (ex: text should be in elements) font-size:0; fixes it... kinda... no text now, but proof of concept (blank text line).

    IE and Firefox (oh look IE does something other browsers do too!).


    Well floating greenspace left fixed it in firefox, IE is still freaking out.
    Last edited by wdroush; 11-26-2009 at 12:26 AM.

  • #2
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,851
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    Now for the weird one... line break in this one (two files, comment processing removed):
    Code:
    <div id="content"><div id="greenspace">
    	<div><img src="http://172.16.100.20/development/cfpg/images/header.png" /></div>
    </div>
    lol, it's that mysterious gap!
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)

  • #3
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by abduraooft View Post
    lol, it's that mysterious gap!
    Wasn't using strict, and was using divs. (no tables whatsoever on the page)

    Floating all the divs fixed the issue in all browsers but IE, IE has a top-margin:-XXpx to fix the problem.


  •  

    Posting Permissions

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