Jump to content
Sign in to follow this  
johnlatham

How can I set a minimum height to pages?

Recommended Posts

johnlatham

How can I set a minimum height to pages? www.johnlathamweddings.com When content is short the pages look short. I am wondering if there is code to set a minimum page height? Thanks, John.

Share this post


Link to post
Share on other sites
Rob
In Custom Code under CSS Rules, you should see [b]body {}[/b] Change that to [b]body {min-height:500px;}[/b] Here, 500px can be set to any number you wish, keeping in mind this is Minimum height not maximum. I've no guarantee this will work as I've not tested it, however, it's discussed at w3schools.com.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites
johnlatham
This works but for the whole page... I need it to expand before the footer so the extra height is within the pages.

Share this post


Link to post
Share on other sites
kastelic
You can add min-height to any element on you page, for example: [code]#maincontent {min-height: 600px }[/code] Using Chrome or Firefox with Firebug, you can inspect your page to see when element you want to add this to.

Share this post


Link to post
Share on other sites
johnlatham
Hey, the code works fine for the pages such as 'contact' and 'about', but on the home page there is a feature panel, and the min height is acting before this, so that page is appearing taller... With a gap in between the content and the feature panel. I'd like to set the minimum height as the same height as the home page current height, so every page looks the same. Is there a way to not include the minimum height on certain pages? Thanks, John.

Share this post


Link to post
Share on other sites
kastelic
Sure, look in the body tag and you will see classes that are unique to each page or type of page, for example: blog, search, page-id-123, cateogory, paged, and so on. So you can set a rule to appear on certain pages like this: [code].blog #maincontent {min-height: 600px } .single #maincontent {min-height: 500px }[/code]

Share this post


Link to post
Share on other sites
johnlatham
Thanks, so will it just be the page name I need to put before the hash? eg. '.contact #maincontent......'?

Share this post


Link to post
Share on other sites
Rob
Yes.

Former PageLines Moderator, Food Expert and Raconteur

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×