Hallo ihr Lieben,
ich hätte mal 'ne Frage zum Monochrome Theme von Graph Paper Press --> SCREENSHOT
Gibt es 'ne Möglichkeit, diese graue Box mit den fünf Posts unten und diese schwarze Box direkt darunter auf 100% Seitenbreite zu strecken?
Ich hab's hier schon mal mit jeweils width=100%; und position: absolute; versucht, allerdings war dann die schwarze Box über der Grauen und beide links immer noch eingerückt. (Auf dem Theme-Demo ist die Ansicht besser, die schwarze Box aber leider textlos und dazu sieht aus, als würde sie zum Hintergrund gehören, von dem her evtl. etwas verwirrend in der Ansicht, der kleine Screenshot zeigt die richtige Version)
PHP
#gray_bg {
background:#ddd;
padding:2em;
margin:0 -2em 0 -2em;
float:left;
position: relative;
}
#dark_bg {
background:#000;
padding:2em;
margin:0 -2em 0 -2em;
color: #666;
float:left;
position: relative;Hier zum Abschluss nochmal 'n längeres Code-Stückchen aus dem Theme. Würde mich freuen, wenn mir jemand weiterhelfen könnte! Danke schon mal! LG
PHP
/*
Theme Name: Monochrome
Theme URI: http://www.graphpaperpress.com/
Description: A Wordpress magazine theme.
Version: 1.2.1
Author: Thad Allender for Graph Paper Press
Author URI: http://www.graphpaperpress.com/
License: GPL
*/
body {
background: #eee url(images/bg.gif) repeat-x top;
margin: 0;
padding: 2em 0;
opacity: .999;
color:#000;
}
.container {
background: #fff;
padding: 1em 2em;
}
.container-bg {
background: #fff;
}
blockquote {
background: url('images/quote.png') .5em top no-repeat;
color: #000;
font-style: normal;
padding: 0 0 0 0;
}
.five_posts h3 a {
text-transform: uppercase;
}
.five_posts h4, h6.category_head {
margin: 0 0 1em;
padding: 0;
text-transform: uppercase;
color: #ff0000;
font-size: .9em;
font-weight: normal;
border-bottom: 1px solid #000;
}
.five_posts h4 a, h6.category_head a {
text-transform: uppercase;
color: #ff0000;
}
.five_posts h4 a:hover, h6.category_head a:hover {
color: #fff;
background: #ff0000;
}
h6.category_more a {
color: #000;
background: #eee;
padding: .3em;
font-size: .9em;
text-transform: uppercase;
border: none;
}
h6.category_more a:hover {
background: #333;
color: #fff;
}
#gray_bg {
background:#ddd;
padding:2em;
margin:0 -2em 0 -2em;
float:left;
position: relative;
}
#dark_bg {
background:#000;
padding:2em;
margin:0 -2em 0 -2em;
color: #666;
float:left;
position: relative;
}
#dark_bg ul li {
list-style-image:none;
border-bottom:1px solid #666;
}
#dark_bg a {
color:#ff0000;
}
#dark_bg a:hover {
color:#fff;
}
#dark_bg h2.widgettitle {
margin: 0 0 1em;
padding: 0;
text-transform: uppercase;
color: #666;
border-bottom:1px solid #666;
font-weight: normal;
}
.five_posts ul {
margin:1em;
}
.five_posts ul li {
color: #000;
font-size: .9em;
line-height: 1.8em;
border-bottom: 1px #000 solid;
list-style-image:none;
margin: 0 0 0 -1em;
}
.five_posts ul li a {
color: #000;
}
.five_posts ul li a:hover {
color: #ff0000;
}
.post h2 {
border-bottom: 1px solid #000;
margin-bottom: 15px;
}
h2.category_page {
background:#000;
margin-bottom: 15px;
color:#fff;
text-transform:uppercase;
text-align:center;
padding:10px;
}
.post h2 a {
color: #000;
text-decoration: none;
}
#maincontent .post h2 {
margin-bottom: 5px;
}
#maincontent .content {
padding: 5px 47px 20px 48px;
}
#maincontent h2.pagetitle {
border: none;
text-transform: uppercase;
}
#feature h3 {
margin-bottom: 0;
padding: 0;
}
#feature p img {
margin: 7px 0 2em 0;
}
.feature_text {
margin-top: 2em;
}
#home_right .entry {
padding: 0 0 2em 0;
}
.news h3 {
text-transform: uppercase;
}
.content {
margin: 0 0 1em 0;
}
ul#featurenav {
margin-left: 0;
padding-left: 0;
white-space: nowrap;
}
#featurenav li {
display: inline;
list-style-type: none;
}
#featurenav a {
padding: 1px 5px;
}
#featurenav a:link, #featurenav a:visited {
background-color: #eee;
border: 1px solid #000;
color: #000;
text-decoration: none;
}
#featurenav a:hover {
background-color: #444;
color: #fff;
text-decoration: none;
}
.author {
background: #eee;
margin-bottom: 1.5em;
padding: 1.5em;
}
.author img {
float: left;
padding: 0 1em 1em 0;
}
.author p {
margin-left: 8em;
}
.author h6 {
border-bottom: 1px #000 dotted;
margin-left: 7em;
}
.navigation,
.navigation a {
color: #AAA;
}
.alignright {
float: right;
}
.alignleft {
float: left;
}
.post {
margin-bottom: 25px;
}
.entry {
padding-bottom: 25px;
}
#header {
height: 50px;
padding: 4px 0 0 0;
width: 950px;
}
#header h1, #header .description {
line-height: 1em;
margin: 0;
padding: 0;
}
h1 a.logo {
text-transform: uppercase;
}
.entry #nav .content {
margin: auto;
padding: 0;
}
.entry #nav {
background: #FFF;
margin-bottom: 15px;
}
.entry #nav li a {
background: #666;
border-right: 1px solid #000;
color: #FFF;
}
.entry #nav li.last a {
border-right: none;
}
.entry #nav li a:hover {
background: #333;
color: #FFF;
}
#footer {
font-size: .9em;
margin: 0;
text-align: center;
}
#footer a {
text-decoration: none;
}
#search {
float: right;
}
#search #s {
background: transparent url('images/icons/search_grey.gif') 0px center no-repeat;
color: #CCCCCC;
font-size: 0.9em;
margin-right: 0px;
margin-top: 10px;
padding: 2px 0 2px 17px;
width: 135px;
}
#search #s:hover {
color: #000;
}
.search-excerpt {
margin: 0;
}
.commentlist li {
padding: 8px 15px;
}
.comments-alt {
background: #EEE;
}
.bottombar {
}
.bottombar h2 {
font-size: 1em;
font-weight: bold;
line-height: 1em;
margin: 1em 0 1em;
}
ul {
list-style-type: none;
margin-left: 1em;
padding: 0;
}
ul li {
background-repeat: no-repeat;
line-height: 2em;
list-style-image: url('images/icons/li.png');
margin: 0;
padding: 0;
}
#top {
margin: 0 auto;
width: 950px;
}
#title {
float: left;
}
#title h1 {
margin: 0;
}
#title h1 a {
color: #fff;
font-weight: bold;
letter-spacing: -.1em;
line-height: 1.3em;
text-transform: uppercase;
}
#title h1 a:hover {
color: #eee;
}
#contents {
background: #fff;
border: 1px solid #ccc;
border-top: none;
clear: both;
margin: 0px;
padding: 15px;
}