SitePoint Sponsor

User Tag List

Results 1 to 11 of 11
  1. #1
    SitePoint Enthusiast
    Join Date
    Dec 2011
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Full width, responsive footer

    Hi,
    I'm using Skeleton framework trying to make a footer that is the full width of the page. Any suggestions on how to do this would be appreciated. Also, is it possible for the text in the footer to be responsive?


    http://tinyurl.com/c55z29t


    Thanks!

  2. #2
    Life is not a malfunction gold trophysilver trophybronze trophy
    TechnoBear's Avatar
    Join Date
    Jun 2011
    Location
    Argyll, Scotland
    Posts
    6,177
    Mentioned
    264 Post(s)
    Tagged
    5 Thread(s)
    By full width, do you mean the full width of the design or the full width of the browser viewport? In either case, move it out of <div class="thirteen columns offset-by-one content">. For full width of the design, put it inside <div class="container">; for full width of viewport, put it inside <body>. I'm not sure what you mean by making the text responsive.

  3. #3
    SitePoint Enthusiast
    Join Date
    Dec 2011
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, that helped me figure out that I was missing a couple of </div>s! It's working now.

  4. #4
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Please help me!

    Quote Originally Posted by girlnoir View Post
    Thanks, that helped me figure out that I was missing a couple of </div>s! It's working now.
    Hi, I am using Skeleton, and I want to do the exact same thing. Make the footer full width. Didnt understand your instructions. What should I write in which document?

    BR / Pierre

  5. #5
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi, I am using Skeleton, and I want to do the exact same thing. Make the footer full width. Didnt understand your instructions. What should I write in which document?

    I want it too look very similar to Super Skeleton (the black and grey in bottom) http://themes.mdnw.net/?theme=SuperSkeleton

    Extremely thankful for any help I can get! / Pierre

  6. #6
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Hi pfriberg. Could you post a link to what you have so far? That makes it much easier to help. Every site is different, even if you are using someone's theme, so we really need to see your actual site to give specific instructions.

  7. #7
    SitePoint Enthusiast
    Join Date
    Dec 2011
    Posts
    27
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi pfirberg,
    I created a div with the id="footer", right before the </body> closing tag in my html doc. Then I added the following to my CSS:
    #footer {
    background: none repeat scroll 0 0 #5C4247;
    color: #E7CBB4;
    font-family: 'DroidSerifRegular';
    font-size: 12px;
    padding-bottom: 12px;
    padding-top: 12px;
    text-align: center;
    width: 100%;
    }

    I'm not sure this it the best way to write the CSS, but it worked for me, as you can see.
    http://tinyurl.com/c55z29t

  8. #8
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ralph.m View Post
    Hi pfriberg. Could you post a link to what you have so far? That makes it much easier to help. Every site is different, even if you are using someone's theme, so we really need to see your actual site to give specific instructions.
    Hi!

    The site is here. http://wostman.se/skelett/

    /Pierre

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    OK, so you might have to find the footer code in your template and take it outside of the <div class="container" id="wrap"> div. That way, it won't be constrained by the fixed width of that wrapper.

  10. #10
    SitePoint Member
    Join Date
    Jan 2012
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi Ralph,

    I still dont understand. I might be slow. Have hard time to find the right document, etc. <edit>

    BR / Pierre
    Last edited by ralph.m; Jan 24, 2012 at 19:12. Reason: removed offer

  11. #11
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,177
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Hi Pierre,

    WordPress is not really my area, so I can only help to a limited extent, but there are lots of WP people around here. I'll move this thread to the WP forum, as the bigger issue here is how to work with WordPress (the CSS issues can come later). Basically, the forums are a place where you come to figure out how to do things yourself with help from others who happen to hang around here. If you'd rather pay someone to do this, it's better to find a developer in your area, or perhaps check out service providers online such as seen at the SitePoint Marketplace.


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
  •