PDA

View Full Version : aligning a column?...



simplekin
Apr 1st, 2007, 04:18 AM
Im preety fustrated, I need to align a column in the middle, but not using ways like right:100px; because it would look diffrent on other resolution settings. What is the code to align a column?

twodayslate
Apr 1st, 2007, 05:03 AM
margin: 0 auto;
That should center you item horizontally.

nexosis
Apr 1st, 2007, 09:22 AM
padding:0 0 0 0

Excavator
Apr 1st, 2007, 05:10 PM
Hello simplekin,
Here's a basic example for you:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
text-align: center;
}
* {
margin: 0;
padding: 0;
border: none;
}
#column {
width: 760px; /*need to give centered element a width*/
margin: 0 auto; /*this centers it*/
background-color: #FFCCCC; /*just so you can see it*/
}
</style>
</head>
<body>
<div id="column">
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<p>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no
sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>
<!--closes column--></div>
</body>
</html>