CSS Forum

**tayhaithian** · 03:22 AM

As title how do i manage a good background from what i have done ? since i can't control the height when its over 100% .
> <''

Thank you in advance.

Below is the css stylesheet code.

Code:

.pagesize{

position: absolute;
top: 0%;
left: 10%; 
width:80%;
height: 100%;

background-image:url('test.jpg');
background-repeat:no-repeat;
background-attachment: fixed;

}

.logo{

position: absolute;
top: 0%;
left: 0%; 
width:40%;
height: 20%;

background-color: green;

}

.mainsponsor{

position: absolute;
top: 0%;
left: 40%; 
width:60%;
height: 20%;

background-color: red;

}

.sidemenu{

position: absolute;
top: 20%;
left: 0%; 
width:15%;
height: 50%;

background-color: yellow;

}

.speaker{

position: absolute;
top: 20%;
left: 16%; 
width: 83%;
height: 30%;

background-color: blue;

}

.vmenu{

position: absolute;
top: 52%;
left: 16%; 
width: 83%;
height: 10%;

background-color: purple;

}

.news{

position: absolute;
top: 64%;
left: 16%; 
width: 60%;
height: 70%;

background-color: teal;

}

.gadget{

position: absolute;
top: 64%;
left: 78%; 
width: 22%;
height: 50%;

background-color: blue;

}

.sponsors{

position: absolute;
top: 134%;
left: 5%; 
width: 90%;
height: 40%;

background-color: blue;

}

Below is HTML page.

Code:

<html>
<head>
<link href="mystyle.css" rel="stylesheet" type="text/css" />

</head>
<body>
<div class="pagesize">

<div class="logo"> </div>

<div class="mainsponsor"> </div>
<div class="sidemenu"> </div>
<div class="speaker"> </div>
<div class="vmenu"> </div>
<div class="news"> </div>
<div class="gadget"> </div>


<div class="sponsors"> </div>


</div>
</body>
</html>

**chrishirst** · 11-21-2009, 06:12 AM

First thing to would be to get rid of all the absolute positioning then you might have a chance of controlling something.