Hi all! 
imagine I have this little table:
<tr>
<td> </td>
<td> text </td>
<td> </td>
</tr>
TD's 1 and 3 are just used for layout, and contain a (different) background-image.
TD in the middle contains all content/text.
How can you make this in CSS?? I can't figure this on out
Sounds like you really just want a center column that is centered (horizontally) in the window. Is that correct? Then have a repeating background image in the body?
If so:
css code:
body {
background: url(images/bgimage.jpg) repeat;}
#centercol {
width: 750px;
background: #CCCCCC;
margin-left: auto;
margin-right: auto;}
html code:
<!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" xml:lang="en" lang="en" >
<head>
<title>testing</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"style.css" type="text/css" />
</head>
<body>
<div id="centercol">content content content</div>
</body>
</html>
is that it? or do you want the columns on the left and right to be used as well?Such a piece of cake!
In CSS:
#mainContent {
background: someColor url(/path/to/BGimage.gif) repeat-y scroll 0 0;
width: 400px; /* Or however wide you need it to be */
}
#mainContent2 {
padding: 0 <space you want on right>px 0 <space you want on left>px;
}
In HTML:
<div id="mainContent">
<div id="mainContent2">
<p>All your content goes here</p>
</div>
</div>God damn, lol, it's easy as that right!
I was just to focused on doing it with 3 div's ...
Many thanks guys!! (y)woo hoo!
You're very welcome.
imagine I have this little table:
<tr>
<td> </td>
<td> text </td>
<td> </td>
</tr>
TD's 1 and 3 are just used for layout, and contain a (different) background-image.
TD in the middle contains all content/text.
How can you make this in CSS?? I can't figure this on out
Sounds like you really just want a center column that is centered (horizontally) in the window. Is that correct? Then have a repeating background image in the body?If so:
css code:
body {
background: url(images/bgimage.jpg) repeat;}
#centercol {
width: 750px;
background: #CCCCCC;
margin-left: auto;
margin-right: auto;}
html code:
<!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" xml:lang="en" lang="en" >
<head>
<title>testing</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<link rel="stylesheet" href=http://www.webdeveloper.com/forum/archive/index.php/"style.css" type="text/css" />
</head>
<body>
<div id="centercol">content content content</div>
</body>
</html>
is that it? or do you want the columns on the left and right to be used as well?Such a piece of cake!
In CSS:
#mainContent {
background: someColor url(/path/to/BGimage.gif) repeat-y scroll 0 0;
width: 400px; /* Or however wide you need it to be */
}
#mainContent2 {
padding: 0 <space you want on right>px 0 <space you want on left>px;
}
In HTML:
<div id="mainContent">
<div id="mainContent2">
<p>All your content goes here</p>
</div>
</div>God damn, lol
, it's easy as that right!I was just to focused on doing it with 3 div's ...
Many thanks guys!! (y)woo hoo!
You're very welcome.