Hallo,
ich möchte einen Rahmen um die gesamte Webseite haben. Er soll sich immer am äussersten Rand befinden und sich der Grösse des Browserfensters anpassen. Mit der Breite des Rahmens (also Links und Rechts) funktioniert dies einwandfrei, in der Höhe schliesst er jedoch nicht mit dem unteren Rand ab, sondern richtet sich scheinbar nach irgendeiner Angabe die ich nicht finden kann.
Hat jemand eine Idee, wie ich dies korrigieren kann?
Dies ist der Blog:
Und dies der style.css-code:
CSS
body {
position: relative; top:0px;
background: #FFFF66;
height: 100%;
font-family: verdana;
text-align:left;
color:#000;
font-size: 10px;
margin: 0px;
padding: 0px;
padding-top: 30px;
border-color: #000000; border-width: 8px; border-style: solid;
}
}
#wrapper {
position: relative;
height: 100%;
width: 760px;
margin: 0 auto;
background-color: #FFFFFF;
}
#insideWrapper {
position: relative;
top: 0px;
height: 100%;
width: 760px;
margin: 0px;
background-color: #FFFFFF;
text-align: left;
}
#insideWrapper:after{
content: "."; display: block; line-height: 1px; font-size: 1px; clear: both;}
.post {
position: relative;
top: 0px;
width: 480px;
left: 0px;
margin: 0px;
background-color: #FFFFFF;
text-align: left;
}
#content {
width: 480px;
margin-left: 220px;
background-color: #FFFFFF;
text-align: left;
}
#sidebar {
position: relative;
float: left;
width: 180px;
left: 30px;
padding: 0px;
margin-top: -20px;
background-color: #FFFFFF;
text-align: left;
color: #000;
line-height: 11pt;
}
.left {
float: left;
margin: 0px 10px 0px 10px;
}
.right {
float: right;
margin: 0px 10px 0px 10px;
}
#masthead {
position: relative;
top: 0px;
background: url('images/logo_head_03.jpg'); background-repeat: no-repeat;
width: 760px;
height: 120px;
margin: 0px;
margin-top: 0px;
margin-left: 30px;
}
.centeredImage {
text-align:center;
margin-top:10px;
margin-bottom:0px;
padding:0px;
}
#footer {
font-size:10px;
position: relative;
color: #000000;
padding-top: 15px;
height: 50px;
width: 760px;
margin: 0px;
margin-top: 100px;
margin-bottom: -30px;
margin-left: 30px;
text-align: left;
}
#footer a {
color: #000000;
}
#footer a:visited {
color: #000000;
}
#footer a:hover {
color: #000000;
border: 0px;
}
.sep {
background: url('');
background-repeat: no-repeat;
background-position: center 100%;
position: relative;
width: 162px;
height: 50px;
margin: 0px;
padding: 0px;
left: 160px;
text-align: center;
}
.commentBox {
position: relative;
margin: 0 auto;
width: 100%;
overflow:hidden;
background-color: #f5f5f5;
text-align: left;
border: 1px solid #999;
padding: 5px;
}
.cite {
font-size: 10px;
color:#000000;
}
code {
font-family: Courier New, Verdana;
text-align:left;
color:#000000;
font-size: 10px;
}
input {
border: 1px solid #000000;
background-color: #FFFFFF;
color: #000000;
padding: 2px;
}
h2 {
color: #000000;
font-size: 10px;
text-align: left;
}
ul {
margin-top: 0px;
margin-left: 0px;
margin-bottom: 0px;
padding-left: 0px;
}
li {
list-style-type: none;
margin-left: 0px;
}
#sidebar li {
font-size: 10px;
font-weight: bold;
padding:5px !important;
padding-left:0px !important;
padding:0px;
border-bottom: 0px solid #000000 !important;
border-bottom: 0px;
}
blockquote, blockquote p {
text-indent: 0px;
margin-bottom: 7px;
color: #000000;
}
.footerLink {
color: #000000;
text-decoration: none;
}
a.footerLink {
color: #000000;
text-decoration: none;
}
a.footerLink:visited {
color: #000000;
text-decoration: none;
}
a.footerLink:hover {
color: #000000;
text-decoration: none;
}
.title {
color: #000000;
font-size: 10px;
font-weight: bold;
}
#sidebar .title {
margin-bottom:0px;
color: #FFFFFF;
font-size: 1pt;
}
a.title {
color: #000000;
}
a.title:visited {
color: #000000;
}
a.title:hover {
color: #000000;
border: 0px;
}
#blogTitle {
position: relative;
top: 50px;
left: 20px;
font-family: 'Arial Black';
color: #333;
font-size: 10px;
text-transform: uppercase;
text-align: left;
}
#blogTitle a {
color: #333;
}
#blogTitle a:visited {
color: #333;
}
#blogTitle a:hover {
color: #ff3333;
border: 0px;
}
.commentPos {
position: relative;
margin: 0px;
padding: 0px;
text-align: center;
font-size:9pt;
text-transform:uppercase;
}
a {
color: #000000;
text-decoration: none;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
color: #000000;
text-decoration: none;
}