Hallo,
ich habe eine Templatevorlage mit der ich etwas experimentiere.
Die "rechtespalte" habe ich eingefügt. Soweit funktioniert das auch, jedoch soll der content ganz nach links. Er beginnt jedoch ca. 100px vom linken Rand. Wenn ich position: absolute;
eingebe, dann beginnt der content direkt am Rand.
Kann mir jemand eine Lösung nennen?
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
color: #000;
background-color: #ffffff;
background-image:url(./images/bg.jpg);
background-repeat:repeat-x;
background-position:30px 120px;
}
a:link, a:visited, a:active {
color: #900;
text-decoration: none;
}
a:hover {
color: #f00;
text-decoration: underline;
}
hr {
margin: 5px 0px 5px 0px;
color: #603;
border: 0;
border-top: 1px solid #603;
height: 1px;
}
/* Page Headings */
h1, h2, h3, h4, h5, h6 {color: #333;font-weight:normal;font-family:"Times New Roman", Times, serif;}
h1 {font-size:2.2em;}
h2 {font-size:1.8em;}
h3 {font-size:1.3em;}
form {margin: 0;}
blockquote {
font-family:"Times New Roman", Times, serif;
font-style:italic;
color: #666;
border-left: 2px solid #666;
padding-left: 10px;
font-size: 1.2em;
}
abbr {}
acroynm {}
cite {}
address {}
strong {}
em {}
#head {
width: 600px;
height: 75px;
background: url(./images/head.jpg);
background-repeat:no-repeat;
position:absolute; top:40px; left:235px;
}
#main { /* Holds the page items in place */
width: 903px;
margin: 37px auto 0 auto;
padding-top: 100px;
background: transparent;
}
#extras { /* objects outside main page (powered by etc) */
width:903px ;
margin: 0 auto;
padding-bottom:10px;
font-family:Tahoma, "Lucida Sans", sans-serif;
font-size: 80%;
color: #666;
padding:0;
color:#eee;
}
#banner {
padding: 24px;
height: 240px;
text-align: left;
background: #fff ;
background: url(./images/banner.jpg);
background-repeat:no-repeat;
font-weight: bold;
border: 0px solid #000;
/*
put a nice background in here
background: transparent url('my-image.jpg') top left no-repeat;
*/
}
#banner a, #banner h1, #banner h2 {color: #fff; margin:0;padding:0;}
* html #banner {clear:both;height:70px;} /* ie6 misbehaves again */
#banner h1 {font-size: 3em;padding-top:6px;} /* WEBSITE_TITLE */
#banner h2 { /* PAGE_HEADER */
font-size: 0.8em;
text-transform:uppercase;
letter-spacing:8px;
margin-top:-20px;
padding-left:8px;
font-family:Arial, Helvetica, sans-serif;
}
#content { /* main content from the WYSIWYG goes in here */
width:600px;
float: left;
text-align: justify;
}
#rechtespalte { /* rechtespalte from the WYSIWYG goes in here */
width: 100px;
float: right;
margin-top: 50px;
text-align: justify;
}
* html #contentContainer #content {text-align:left;} /* ie6 misbehaves */
* html #contentContainer #content table {width: 50%;} /* ie6 fix to stop tables being pushed below floats */
#footer {
font-family:"Times New Roman", Times, serif;
clear: both;
font-size: 90%;
color: #666;
border-top: 2px solid #555;
padding: 10px 5px 10px 5px;
background: #cecece;
}
Vielen Dank für Tips.
Patigol
ich habe eine Templatevorlage mit der ich etwas experimentiere.
Die "rechtespalte" habe ich eingefügt. Soweit funktioniert das auch, jedoch soll der content ganz nach links. Er beginnt jedoch ca. 100px vom linken Rand. Wenn ich position: absolute;
eingebe, dann beginnt der content direkt am Rand.
Kann mir jemand eine Lösung nennen?
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
color: #000;
background-color: #ffffff;
background-image:url(./images/bg.jpg);
background-repeat:repeat-x;
background-position:30px 120px;
}
a:link, a:visited, a:active {
color: #900;
text-decoration: none;
}
a:hover {
color: #f00;
text-decoration: underline;
}
hr {
margin: 5px 0px 5px 0px;
color: #603;
border: 0;
border-top: 1px solid #603;
height: 1px;
}
/* Page Headings */
h1, h2, h3, h4, h5, h6 {color: #333;font-weight:normal;font-family:"Times New Roman", Times, serif;}
h1 {font-size:2.2em;}
h2 {font-size:1.8em;}
h3 {font-size:1.3em;}
form {margin: 0;}
blockquote {
font-family:"Times New Roman", Times, serif;
font-style:italic;
color: #666;
border-left: 2px solid #666;
padding-left: 10px;
font-size: 1.2em;
}
abbr {}
acroynm {}
cite {}
address {}
strong {}
em {}
#head {
width: 600px;
height: 75px;
background: url(./images/head.jpg);
background-repeat:no-repeat;
position:absolute; top:40px; left:235px;
}
#main { /* Holds the page items in place */
width: 903px;
margin: 37px auto 0 auto;
padding-top: 100px;
background: transparent;
}
#extras { /* objects outside main page (powered by etc) */
width:903px ;
margin: 0 auto;
padding-bottom:10px;
font-family:Tahoma, "Lucida Sans", sans-serif;
font-size: 80%;
color: #666;
padding:0;
color:#eee;
}
#banner {
padding: 24px;
height: 240px;
text-align: left;
background: #fff ;
background: url(./images/banner.jpg);
background-repeat:no-repeat;
font-weight: bold;
border: 0px solid #000;
/*
put a nice background in here
background: transparent url('my-image.jpg') top left no-repeat;
*/
}
#banner a, #banner h1, #banner h2 {color: #fff; margin:0;padding:0;}
* html #banner {clear:both;height:70px;} /* ie6 misbehaves again */
#banner h1 {font-size: 3em;padding-top:6px;} /* WEBSITE_TITLE */
#banner h2 { /* PAGE_HEADER */
font-size: 0.8em;
text-transform:uppercase;
letter-spacing:8px;
margin-top:-20px;
padding-left:8px;
font-family:Arial, Helvetica, sans-serif;
}
#content { /* main content from the WYSIWYG goes in here */
width:600px;
float: left;
text-align: justify;
}
#rechtespalte { /* rechtespalte from the WYSIWYG goes in here */
width: 100px;
float: right;
margin-top: 50px;
text-align: justify;
}
* html #contentContainer #content {text-align:left;} /* ie6 misbehaves */
* html #contentContainer #content table {width: 50%;} /* ie6 fix to stop tables being pushed below floats */
#footer {
font-family:"Times New Roman", Times, serif;
clear: both;
font-size: 90%;
color: #666;
border-top: 2px solid #555;
padding: 10px 5px 10px 5px;
background: #cecece;
}
Vielen Dank für Tips.
Patigol