PDA

View Full Version : CSS Woes..



Lewwy
July 10th, 2007, 11:13 AM
Hey, my site should look like this when viewed in a browser :
http://evolewtion.co.uk/images/evoDesign.png

Unfortunately, it looks like this :
http://www.evolewtion.co.uk/site

Here is the CSS I use:

<style type = "text/css">
body{
margin: 0px;
font-family: Verdana;
font-size: 10px;
background-color: #FFFFFF;
}

.container {
width: 500px;
height: auto;
background-color: #fff;
margin:0 auto;
margin-top: 20px;
}

.menu {
width: 100%;
height: 13px;
color: #d4c8cc;
border-color: #ff3288;
border-width: 12px;
border-style: solid;
}

.header {
width: 1000px;
height: auto;

}

.promotions {
border-bottom: 10px solid #000;
width: 1000px;
height: auto;
}

.content1 {
background-color: #fff;
width: 200px;
height: 50%;
margin-top: 10px;
margin-right: 20px;
float: left;
border-left-style: dashed;
border-left-color: #ff3bd6;
}

.content2{

width: 550px;
height: 100%;
float: right;
position:static;
margin-top: 10px;
background-color: #fff;
border-left-style: dashed;
border-left-color: #5cf900;
padding-left: 10px;
}

</style>

How do I get the contact section (or content2 as labelled in CSS Stylesheet) to display side by side with 'hmm' or 'content1'. Any help is GREATLY appreciated.

Another problem is the site displays to the right, I have tried a few methods to center it, but none seem to work, even put it all in a table and had that centered, but it didnt work :(

Again, thanks for any help !

Icy Penguin
July 11th, 2007, 12:18 AM
Your link doesn't work and the image isn't showing up.

But (for the side-by-side thing), it osunds like you need floats. Just google 'css float' or something and there's lots of info on it. :)

And to center the entire site:



<body>
<div style="margin: 0px auto; text-align: center;">
stuff in here will be centered.
</div>
</body>