CODEWITHSUNDEEP
htmlcss
Salim
Salim

Reputation: 143

defining doctype html is causing div height to be 0 pixel

I have a webpage, in which doctype is defined like 

<!DOCTYPE html>

and corresponding style sheet consist of a division id wrap with just following property

    #wrap
{
    width:100%;
    height:100%;

}

this causes the wrap to shrink to 0px in height although width remains 100%. But when the doctype tag is removed its according to property specified in css i.e width:100% and height 100%. Possible Causes and solutions?

Upvotes: 2

Views: 60

Answers (1)

gopalraju
gopalraju

Reputation: 2309

If you're trying to make the height equal to window height, check this:

#wrap
{
   width:100%;
   height:100vh;
}

Fiddle: http://jsfiddle.net/4o3vxbgu/

If you're trying to match the parent's height, use height:100% to all parent elements (including body and html).

html,body,#wrap{
 height:100%;
}

Fiddle: http://jsfiddle.net/4o3vxbgu/1/

Upvotes: 1

Related Questions