---
title: "how to make the min-height of body equal to screen.height"  
description: "how to make the min-height of body equal to screen.height"  
author: "Anonymous User"  
published: 2013-06-15  
updated: 2013-06-15  
canonical: https://www.mindstick.com/forum/1150/how-to-make-the-min-height-of-body-equal-to-screen-height  
category: "css-css3"  
tags: ["css-css3"]  
reading_time: 1 minute  

---

# how to make the min-height of body equal to screen.height

Hi [Expert](https://www.mindstick.com/articles/13120/an-expert-financial-advice-will-improve-your-finances),\
My [Website](https://www.mindstick.com/articles/13110/why-copywriting-is-crucial-for-new-website-build) here I have a page About Us due to lack of [content](https://www.mindstick.com/articles/13019/get-the-best-content-marketing-pricing-packages-for-your-brand) we can not cover the complete height of the screen. And my footer starts [floating](https://www.mindstick.com/articles/85595/how-to-troubleshoot-when-your-floating-pond-fountain-is-not-working-properly) in the air.. I tried doing it using min-height in a fieldset but unfortunately it works on my [browser](https://www.mindstick.com/blog/155254/which-is-the-best-internet-browser) only as soon as I change my browser or try on other [system](https://www.mindstick.com/articles/23411/the-most-effective-method-to-find-the-perfect-small-business-phone-system-for-your-business) the [problem](https://yourviews.mindstick.com/view/81399/tackling-the-problem-of-unemployment-during-corona-pandemic) start again... I have tried:\
**CSS**\

```
html,body{  min-height:100%;  height:100%;  }  [id]center_wrapper{  min-height:100%;  height:100%; }  Javascriptvar body1 = document.getElementsByTagName('body')[0];  console.log(body1);  body1.style.minHeight = screen.height;  body1.style.height = screen.height;  console.log(body1.style.minHeight);  
```

**\**jQuery\

```
$('body').css('min-height', screen.height);  $('body').css('height', screen.height);  console.log(document.getElementsByTagName('body')[0].style.minHeight);  
```

**\**While using both jQuery and [javascript](https://www.mindstick.com/articles/874/how-to-create-watermark-text-for-textbox-by-using-javascript) [Console](https://www.mindstick.com/blog/210/the-console-class) Log it does [shows](https://yourviews.mindstick.com/view/81380/new-york-violent-shooting-shows-people-are-not-safe-in-night-life) 704px but it is not 704px.. I guess it might be because change occurs after DOM is created..\
Any help..\

## Replies

### Reply by AVADHESH PATEL

Hi Tanuj,\
Alright, since that didn't work... You have an html element style found in your div id "center_wrapper" it is contained within div id "title". Change the element style of min-height to 450 as shown below:\
<fieldset id="center_wrapper" style="min-height: 450px;">\
That should do the trick...


---

Original Source: https://www.mindstick.com/forum/1150/how-to-make-the-min-height-of-body-equal-to-screen-height

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.