www.webdeveloper.com
Results 1 to 6 of 6

Thread: Gap at the top of web pages

  1. #1
    Join Date
    Jul 2009
    Posts
    43

    Gap at the top of web pages

    Hey guys, I have a gap at the top of my web pages, however it is not there when i load the page offline. How can I remove it? Also I have tried to have a 2px black border around all the content. It works in the my background page but none of the other ones, however I am not sure why? The website is http://www.cherrietestingwebsite.com/.

  2. #2
    Join Date
    Sep 2006
    Location
    new york
    Posts
    266

    <SYYLE> embedded on page

    On that one page, you have
    Code:
    		
    <link rel="stylesheet" href="style.css" />
    		<style type="text/css">
    			body{font:12px/1.2 Verdana, sans-serif; padding:0 10px;}
    			h2{font-size:13px; margin:15px 0 0 0;}
    		</style>
    		<link rel="stylesheet" href="colorbox.css" />
    		<script type="text/javascript" src="mainjquery.js"></script>
    		<script type="text/javascript" src="jquery.colorbox.js"></script>
    OOPS! I have to take another look. At first thought that had to do with border.

    Viewing site on MAC Firefox, I did not see space. Did not check your stylesheet. but general consensus is to ZERO out padding, margin, border for HTML and BODY because of browser differences.

  3. #3
    Join Date
    Sep 2006
    Location
    new york
    Posts
    266

    my best quess

    Looking at your style.css
    Code:
    *{ margin:0px; padding:0px; } img{ border:0px } html{ width:100%; }
    .container { width:962px; margin-left:auto; margin-right:auto; background: #ffffff; border: 2px solid #000000; }
    body{ width:962px; margin:auto; position:relative; 
    background-color: #ee652a; background-image:url('images/bgimage.png'); background-repeat: repeat-x; }
    I don't see why and did not see any conflict with jQuery.css. When page was reduced way down, the white space at top was evident.

    Just guessing: assigning the background image and color to the HTML element and making BODY transparent might get rid of that white gap.

  4. #4
    Join Date
    Feb 2012
    Posts
    61
    ohh bit mistake here is ....

    add this code <div style="clear:both;"></div> in last of container tag .... before close the container tag just up the you currently did...(as reference to current move one step up)
    Thanks,
    Som
    Full2pune

  5. #5
    Join Date
    Jul 2009
    Posts
    43
    Hey guys thanks for the help. Jadav soma is there anyway, you could edit one of the pages source code offline and then copy and paste that part of it in the window regarding the <div> container part as I am not entirely sure what you mean. Thank you.

  6. #6
    Join Date
    Feb 2012
    Posts
    61
    ok, please check the below code ........and se the difference between your current code and this one.....

    <div id="footer">

    <a href="index.html">Home</a>|
    <a href="mybackground.html">My backgorund</a>|
    <a href="help.html">How I can help</a>|
    <a href="success.html">Success Stories</a>|
    <a href="contact.html">Get in touch</a>|
    <br />
    Copyright &copy;. All rights reserved. Design by <a href="http://www.google.com">Cherrie Web Design</a> </div>

    <!--END OF FOOTER SECTION-->
    <div style="clear:both;"></div>
    </div>
    </body>
    </html>
    Thanks,
    Som
    Full2pune

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles