SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Guru james_littler's Avatar
    Join Date
    May 2007
    Location
    Portsmouth, UK
    Posts
    775
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    p causing scroll

    Hi all, working my way through this site revamp just adding in content now.

    Kind of hit a wall though. I added terms and conditions with a link to them in the footer of every page, but the containing p is causing the pages to have a slight scroll on them, even though it's not needed to view all content on some/most pages.

    I was wondering if anyone could possibly take a look and tell me where I'm being stupid.

    Thanks.

    Site is live here

    the p in question is #footer p which has the following attributes

    Code CSS:
    #footer p {
    	position: relative;
    	color: #FFFFFF;
    	text-align: center;
    }


    I'll supply more code on request as there's alot of it. I'm coding in xhtml 4.01 Transitional so code is availiable by viewing the page source.

  2. #2
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,702
    Mentioned
    101 Post(s)
    Tagged
    4 Thread(s)
    You may want to limit the css p styles to #content, because as things stand the extra margins on the padding are also having an effect on the #footer p as well.

    The css forum people will be able to help much better, but hopefully that's pointed you in the right direction.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  3. #3
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    As pmw57 says, the p bottom padding is also effective on the footer. The 1em bottom padding is causing the scroll with larger user font set. Remove the bottom padding:
    Code:
    #footer p {
    	position: relative;
    	color: #FFFFFF;
    	text-align: center;
    	padding: 8px 0 0; /* bottom padding 0 */
    }
    Happy ADD/ADHD with Asperger's

  4. #4
    SitePoint Guru james_littler's Avatar
    Join Date
    May 2007
    Location
    Portsmouth, UK
    Posts
    775
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    cheers for your help guys

    1px padding makes all the difference!


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
  •