Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 11
  1. #1
    Member
    Join Date
    Sep 2012
    Posts
    64
    Member #
    32790
    Liked
    3 times
    Hiya,

    I am defining the responsiveness on a website I am doing. I am currently working on 320px - 480px and I have noticed on one of my pages the footer sits at the top the content instead of at the bottom. The template is the same as most of the other pages and they are ok... any suggestions?

    Link to website here

    The problem is only at resolution 320px - 480px

  2.  

  3. #2
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    On what browser ?

  4. #3
    Member
    Join Date
    Sep 2012
    Posts
    64
    Member #
    32790
    Liked
    3 times
    I am using Firebox - Designer Responsive View

  5. #4
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    All the pages that I viewed loaded to what I think was correct on my iPhone ?

    Except for the message wanting me to enable cookies

    You have a specific page without me having to look at all of them ?

  6. #5
    Member
    Join Date
    Sep 2012
    Posts
    64
    Member #
    32790
    Liked
    3 times
    Yes sorry I thought I had specified what page, it is the gallery page

  7. #6
    Senior Member Webzarus's Avatar
    Join Date
    May 2011
    Location
    South Carolina Coast
    Posts
    3,322
    Member #
    27709
    Liked
    770 times
    Since I can see it... Bunk suspect its a conflict with the gallery plugin CSS

    Is showing up on safari on an iPhone ...

    I'd check the gallery code to see if there's an extra closing div within it.

  8. #7
    Member
    Join Date
    Sep 2012
    Posts
    64
    Member #
    32790
    Liked
    3 times
    Hiya, I just checked it and couldn't find anything :-/

    My html for the thumbnails (which seems to be a problem) is
    HTML Code:
    <div class="gallerybox">
    <a href="http://kerrylouisebespokesoftfurnishings.co.uk/gallery/blinds/"><img class="alignnone size-full wp-image-403" alt="thumbnail-blinds" src="http://kerrylouisebespokesoftfurnishings.co.uk/wp-content/uploads/2012/11/thumbnail-blinds.jpg" width="150" height="150" /></a>
    <h2>Blinds</h2>
    <div class="galleryboxdesc">
    <h5><a href="http://kerrylouisebespokesoftfurnishings.co.uk/gallery/blinds/">View Gallery</a></h5>
    </div>
    </div>
    The css is:-
    Code:
    /*** Gallery // thumbnails *******************************/
    .gallerybox{height:230px; max-width:150px; float:left; margin-right:15px;}
    .gallerybox2{height:220px; max-width:150px; float:left; margin-right:15px; margin-top:-15px;}
    .gallerybox3{height:170px; max-width:150px; float:left; margin-right:15px; margin-top:-15px;}
    .galleryboxdesc{height:50px; width:150px; float:left; margin-right:15px; margin-top:-10px; margin-bottom:10px;}
    .galleryboxdesc2{height:50px; width:150px; float:left; margin-right:15px; margin-top:-10px; margin-bottom:10px;}
    .galleryboxwrap{float:left; margin-bottom:20px;}
    .dividergallery{height:5px; margin-bottom:0px; float:left; width:100%;}
    .divider{border-bottom:solid 1px #ccc; margin-bottom:10px; float:left; width:100%;}

  9. #8
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    Clear your floats.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  10. #9
    Member
    Join Date
    Sep 2012
    Posts
    64
    Member #
    32790
    Liked
    3 times
    When I clear the floats they don't sit next to each other anymore

  11. #10
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    You only clear after the last one. I'm assuming that .galleryboxwrap is a wrapper around the other gallery boxes? If that's the case, just add this to your code:
    Code:
    .galleryboxwrap::after{
      content:"";
      clear:both;
      display:block;
      height:0;
      width:0;
    }
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."


Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 09:57 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com