hier die css meiner seite
hier einmal die css-datei meiner seite:
/*---| Dateiweite Einstellungen |---*/
* {
margin: 0;
padding: 0;
border: 0;
}
body {
background: #fdf8e6;
color: #5a5a5a;
font: 80% Verdana,Arial,Helvetica,sans-serif;
text-align: center;
}
input, textarea {
background: #fdf8e5;
color: inherit;
border: 1px solid #f3d68f;
margin: 0 10px 10px 0;
padding: .2em;
}
textarea {
overflow: auto;
}
.zentrieren {
text-align: center;
}
.clear {
clear: both;
}
/*---| Wrapper |---*/
#wrapper {
background: url(images/wrap.jpg) repeat-y;
width: 1000px;
margin: 0 auto;
text-align: left;
border: 2px solid #e5e5e5;
}
/*---| Kopfbereich |---*/
#kopf {
background: url(images/head.jpg) no-repeat;
height: 140px;
padding-left: 280px;
}
#kopf h1 {
padding-top: 35px;
font-size: 2.0em;
}
#kopf a:link,
#kopf a:visited {
color: #FF8928;
background: inherit;
text-decoration:none;
}
#kopf a:hover,
#kopf a:active,
#kopf a:focus {
color: #008EFF;
background: inherit;
}
/*---| Navigationsleiste |---*/
#sidebar {
width: 216px;
float: left;
margin-left: 20px;
margin-top: -118px;
}
#sidebar ul li {
padding: 2px 5px 2px 25px;
list-style: none;
color: #008EFF;
}
#theme li {
background: url(images/thema.gif) no-repeat center left;
color: #008EFF;
}
#archives li {
background: url(images/archiv.gif) no-repeat center left;
color: #008EFF;
}
#pages li {
background: url(images/seite.gif) no-repeat center left;
}
#feed li.rss {
background: url(images/feeds.gif) no-repeat center left;
}
#kategorien li,
.widget_categories li {
background: url(images/kat.gif) no-repeat center left;
border: 1px solid #fdf8e6;
}
#links li {
background: url(images/links.gif) no-repeat center left;
}
#letzte_beitraege li,
#recent-posts li {
background: url(images/letzte.gif) no-repeat center left;
}
#meta li {
background: url(images/register.gif) no-repeat center left;
}
#meta li.login {
background: url(images/login.gif) no-repeat center left;
}
#meta li.valid {
background: url(images/valid.gif) no-repeat center left;
}
#meta li.wp {
background: url(images/wp.gif) no-repeat center left;
}
#meta li.xfn {
background: url(images/xfn.gif) no-repeat center left;
}
#recent-comments li {
background: url(images/comment.gif) no-repeat center left;
}
.widget_rss li {
background: url(images/rss.gif) no-repeat center left;
}
.widget_rss img {
display: none;
}
/*--- | Inhaltsbereich - allgemeingültige Formatierungen |---*/
#content {
overflow: hidden;
padding-left: 21px;
text-align: justify;
}
#content a:link,
#content a:visited {
color: #FF8928;
background: transparent;
text-decoration:none;
}
#content a:hover,
#content a:active,
#content a:focus {
color: #008EFF;
background: transparent;
}
#content p {
line-height: 1.4em;
padding-bottom: 8px;
}
#content ul{
margin: 5px 5px 5px 25px;
line-height: 1.2;
}
#content ol {
margin: 5px 5px 5px 35px;
line-height: 1.2;
}
#content ul li {
list-style-image: url(images/list.jpg);
}
#content h2 {
font-size: 1.2em;
color: #008EFF;
}
#content h3 {
font-size: 1.1em;
}
#content h4 {
font-size: 1.0em;
margin: .8em 0;
}
#content blockquote {
background: #f9edc3;
color: inherit;
border: 1px solid #e7b56c;
padding: 10px;
margin: 15px 25px;
}
#content q {
font-style: oblique;
}
#content pre {
margin: 10px;
}
#content code,
#content pre {
font-size: 1.2em;
}
#content acronym,
#content abbr {
border-bottom: 1px dashed #FF8928;
cursor: help;
}
#content table {
border-collapse: collapse;
margin: 1.0em;
}
#content caption {
font-weight: bold;
margin: 1.2em 0 1.0em 0;
}
#content th {
color: #FF8928;
background: #fdf8e6;
border: 1px solid #f3d690;
padding: .2em;
}
#content td {
border: 1px solid #e5e5e5;
background: #f2f2f2;
color: #FF8928;
padding: .2em;
}
/*---| Inhaltsbereich - Beiträge und Kommentare |---*/
#content .ueberschrift {
margin-left: 20px;
letter-spacing: 2px;
}
#content .beitrag {
margin: 20px;
}
#content .beitrag h2 {
padding-bottom: 10px;
}
#content .datum {
height: 64px;
width: 56px;
background: #fdf8e5 url(images/date.jpg) no-repeat;
color: #FF8928;
text-align: center;
float: right;
margin-right: 25px;
display: inline; /*gegen den Double margin Bug des IE*/
}
#content .datum .monat {
font-weight: bold;
color: #5a5a5a;
}
#content .datum .tag {
font-size: 1.2em;
font-weight: bold;
padding-top: 4px;
display: block;
}
#content .datum .jahr {
font-weight: bold;
font-size: .8em;
}
#content .beitragskopf {
float: left;
width: 585px;
border-bottom: 1px dotted #FF8928;
}
#content .text {
clear: left;
padding: 10px 0;
}
.text img {
border: 2px solid #E7B56C;
}
img.centered {
padding: 2px;
display: block;
margin-left: auto;
margin-right: auto;
margin-bottom: 2px;
border: 2px solid #ff8928;
}
#content .beitragsfuss {
border-top: 1px dotted #FF8928;
border-bottom: 1px dotted #FF8928;
padding: 5px 0;
font-size: 0.8em;
line-height: 1.3em;
}
#content .beitragsinfo {
font-size: 0.8em;
}
#content .beitragsinfo .kat {
background: url(images/kat.gif) no-repeat;
display: block;
float: left;
padding: 5px 0 5px 20px;
width: 350px;
font-weight: bold;
}
#content .beitragsinfo .komm {
background: url(images/comment.gif) no-repeat;
display: block;
float: right;
padding: 5px 0 5px 20px;
width: 140px;
font-weight: bold;
}
#content .beitragsinfo .tagging {
background: url(images/tag.gif) no-repeat;
display: block;
float: right;
padding: 5px 0 5px 20px;
}
#content p.keinkommentar {
background: url(images/no_comment.gif) no-repeat;
padding-left: 20px;
}
#content #kommentare {
margin: 20px;
}
#content #kommentare p {
margin-bottom: 10px;
}
#content #kommentare .kom {
background: url(images/comment.gif) no-repeat;
padding-left: 20px;
margin-bottom: 10px;
}
#content #kommentare ol {
margin:0;
}
#content #kommentare ol li {
list-style: none;
}
#content #kommentare h3.stift {
background: url(images/stift.gif) no-repeat;
padding: 0 0 10px 20px;
}
#content p.moderation {
font-style: italic;
color: #db8a67;
background: inherit;
}
#content .kommentarmeta {
font-size: 0.8em;
}
#content .kommentar,
#content .autorenkommentar {
padding: 5px;
margin-bottom: 10px;
}
#content .kommentar blockquote,
#content .autorenkommentar blockquote {
background: transparent;
margin: 10px;
font-style: oblique;
color: #008EFF;
}
#content .kommentar {
background: #f2f2f2;
color: inherit;
border: 1px solid #dfdfdf;
}
#content .autorenkommentar {
border: 1px solid #f3d690;
background: #fdf8e6;
color: inherit;
}
#content .kommentar blockquote,
#content .autorenkommentar blockquote {
border:none;
text-indent: 0;
margin: 0;
min-height: 24px;
}
#content .bearbeiten {
}
/*---| Seitennavigation |---*/
.navigation {
text-align: center;
margin: 15px;
font-size: .8em;
}
.next {
float: left;
text-align: left;
width: 50%;
}
.prev {
float: right;
text-align: right;
width: 50%;
}
/*---| Fuss |---*/
#fuss {
background: url(images/footer.jpg) no-repeat;
clear: both;
height: 54px;
padding: 10px 0 0 280px;
font-size: 0.8em;
text-align: center;
}
#fuss a:link,
#fuss a:visited {
color: #FF8928;
background: #f2f2f2;
text-decoration:none;
}
#fuss a:hover,
#fuss a:active,
#fuss a:focus {
color: #008EFF;
background: #f2f2f2;
}
/*---| Suchen |---*/
#searchform #s {
background: #fff;
border: 1px solid #f3d68f;
color: #FF8928;
font-weight: normal;
padding: 3px;;
}
#searchform #s:hover {
cursor: default;
}
#searchform input {
border: 0;
background: transparent;
color: #FF8928;
font-weight: bold;
margin: 0;
padding: 0;
}
#searchform input:hover {
cursor: pointer;
}
/*---| Kalender |---*/
#wp-calendar {
border-collapse: collapse;
font-size: 100%;
line-height: 1.3em;
margin: 0 auto;
}
#wp-calendar caption {
margin: 0 auto;
font-weight: bold;
}
#wp-calendar th {
text-align: center;
}
#wp-calendar table.nav,
#wp-calendar th,
#wp-calendar td {
padding: 1px 3px;
}
#wp-calendar td {
text-align: center;
font-weight: bold;
}
#wp-calendar #next a {
padding-left: 1px;
text-align: right;
}
#wp-calendar #prev a {
padding-right: 1px;
text-align: left;
}
#wp-calendar a {
display: block;
text-decoration: none;
}
#wp-calendar tbody td a {
color: #FF8928;
background: #fdf8e6;
}
#wp-calendar tbody td a:hover {
color: #008EFF;
background: #fdf8e6;
}
#wp-calendar #today {
background: #fff;
color: inherit;
border: 1px solid #008EFF;
}
#wp-calendar #today a {
background: #fff;
color: #FF8928;
}
#wp-calendar #today a:hover {
background: #fff;
color: #008EFF;
}
#wp-calendar tfoot td {
border: 0;
}
#wp-calendar tfoot td a {
color: inherit;
background: #fdf8e6;
}
#wp-calendar tfoot td a:hover {
color: #FF8928;
background: #fdf8e6;
}
/*---| Pagebar |---*/
#content .pagebar {
height: 25px;
margin-top: 10px;
}
#content .pagebar span {
padding: 2px 6px;
font-weight: bold;
}
#content .pagebar a {
background: #f2f2f2;
color: inherit;
border: 1px solid #dfdfdf;
padding: 2px 6px;
}
#content .pagebar a:hover,
#content .pagebar a:active,
#content .pagebar a:focus {
background: #fff;
color: inherit;
}
Alles anzeigen
wo muss ich mit welcher angabe den content begrenzen?
wenn ich von der ganzen seitenbreite (= 1000px) die sidebar (= 216px) abziehe, müsste eine weitenangabe von 784px für den content überbleiben.
wenn ich bei #content aber eine breitenangabe in dieser größe mache, wird auch in den anderen browsern der inhalt unter die sidebar verschoben.
irgendwie stehe ich im moment auf dem schlauch.