Tue, 2012-02-21 20:39
Hello,
I have an issue with my layout.
I have a html file with the following code:
<body> <div class="page"> </div> </body>
and CSS file with the following arguments:
body { margin-left: 10%; margin-right: 10%; } .page { position:relative; width:100%; height:100%; background-color:black; }
Issue is that there is no background color displayed. I'm trying to get a black background for my page class div. Can please someone explain me what is wrong with this code?
Tue, 2012-02-21 22:37
#1
Area with margins doesnt display background color
The background colour is there, you need to put a height onto the container for example, 300px for you to see it or let the content within .page class fill the space thus automatically getting bigger in height.
Wed, 2012-02-22 08:02
#2
we need put some space in
we need put some space in that div like below:
<div class="page"> </div>
without space the browser doesn't consider anything in this div. now its shows the background color.
Wed, 2012-02-22 19:32
#3
Thank you. It is showing the
Thank you. It is showing the background color now, but my page classes height:100% doesn't seem to work, I want it to be as high as is the window of the browser, but it's not.
Thu, 2012-02-23 14:00
#4
HTML is pretty much just a
HTML is pretty much just a bunch of containers stacked inside each other.
First we have the container,
then the container inside of that,and the
container inside of that.
like this. it is working fine now.
html{ height:100%; } body { margin-left: 10%; margin-right: 10%; height:100%; } .page { position:relative; min-height: 100%; width:100%; background-color:black; }
html:
<div class="page"> </div>
Sun, 2012-02-26 21:17
#5
Great, it works! Thank you
Great, it works! Thank you balajidesign and others for replies.