css ??

Status
Niet open voor verdere reacties.
J

jacob001

Nieuwe gebruiker
Lid geworden
28 jul 2009
Berichten
3
heb een template gedownload ben hem nu aan het aanpassen.
maar wil een extra veld naast de wide post al 2 dagen aan het tobben lukt me niet.
wie o wie
Code: 
* {
	margin: 0;
	padding: 0;
}

body {
	background: #A9B3BB url(images/img01.gif) repeat-x;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #555555;
}

h1, h2, h3 {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

h1 {
	font-size: 3em;
}

h2 {
	font-size: 2em;
}

h3 {
	font-size: 1em;
}

p, ul, ol {
	margin-bottom: 1em;
	line-height: 140%;
}

a {
	color: #333333;
}

a:hover {
	text-decoration: none;
	color: #FC3E1A;
}

img.left {
	float: left;
	margin: 3px 20px 0 0;
	border: 3px solid #848C8F;
}

img.right {
	float: right;
	margin: 3px 0 0 20px;
	border: 3px solid #848C8F;
}

hr {
	display: none;
}

/* Header */

#logo {
	width: 1024px;
	height: 130px;
	background-image: url(images/l_18go4all1.gif);
	background-repeat: no-repeat;
	background-position: 0px 50px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 70px;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 100px;
}

#logo h1, #logo p {
	color: #FFFFFF;
}

#logo h1 {
}

#logo p {
	margin: 0;
	padding: 0 0 0 2px;
	line-height: normal;
}

#logo a {
	text-decoration: none;
	color: #FFFFFF;
}

/* Menu */

#menu {
	width: 1024px;
	height: 70px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

#menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
	line-height: normal;
}

#menu li {
	display: inline;
}

#menu a {
	display: block;
	float: left;
	height: 38px;
	text-decoration: none;
	font: bold 1.2em "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #333333;
	padding-top: 12px;
	padding-right: 30px;
	padding-bottom: 0;
	padding-left: 30px;
}

#menu a:hover {
	text-decoration: underline;
}

#menu .current_page_item a {
	background-repeat: no-repeat;
	background-position: center bottom;
}

/* Wide Post */

.wide-post {
	width: 770px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-top-width: thick;
	border-right-width: thick;
	border-bottom-width: thick;
	border-left-width: thick;
	background-image: url(images/img04.gif);
	background-repeat: repeat-y;
	background-color: #D4DADD;
}

.wide-post .title {
	padding: 30px 30px 20px 30px;
	background: url(images/img05.gif) no-repeat;
	font-size: 2em;
}

.wide-post .title a {
	text-decoration: none;
	border-bottom: 1px solid #B4BBBE;
	color: #333333;
}

.wide-post .title a:hover {
	border: none;
}

.wide-post .entry {
	padding-top: 0;
	padding-right: 30px;
	padding-bottom: 0;
	padding-left: 30px;
}

.wide-post .bottom {
	height: 20px;
	background: url(images/img06.gif) no-repeat left bottom;
}

.wide-post .links {
	clear: both;
	margin: 0;
	padding: 10px;
	background: #CDD4D7;
	border-top: 1px solid #B4BBBE;
	font-size: .9em;
}

.wide-post .links a {
	text-decoration: none;
}

.wide-post .links .date {
	padding-left: 20px;
	background: url(images/img08.gif) no-repeat left center;
}

.wide-post .links .author {
	padding-left: 20px;
	background: url(images/img09.gif) no-repeat left center;
}

.wide-post .links .comments {
	padding-left: 20px;
	background: url(images/img10.gif) no-repeat left center;
}

.wide-post .links .feeds {
	padding-left: 10px;
	background: url(images/img11.gif) no-repeat left center;
}

/* Two Columns */

.two-columns {
	width: 1024px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 20px;
	padding-right: 0;
	padding-bottom: 20px;
	padding-left: 0;
}

.two-columns .column-one {
	float: left;
	width: 250px;
}

.two-columns .column-two {
	float: right;
	width: 370px;
}

.two-columns .title {
	height: 28px;
	padding: 7px 0 0 10px;
	background: #DB8603 url(images/img12.gif) no-repeat;
	font-size: 1.4em;
	color: #333333;
}

.two-columns .entry {
	background: url(images/img13.gif) repeat-x;
}

/* Recent Posts */

#recent-posts {
}

#recent-posts ul {
	margin: 0;
	padding: 20px;
	list-style: none;
}

#recent-posts li {
	padding: 5px 15px;
	background: url(images/img14.gif) no-repeat left center;
	border-bottom: 1px solid #949EA4;
}

/* Recent Comments */

#recent-comments {
}

#recent-comments ul {
	margin: 0;
	padding: 20px;
	list-style: none;
}

#recent-comments li {
	padding: 5px 15px 5px 17px;
	background: url(images/img15.gif) no-repeat left center;
	border-bottom: 1px solid #949EA4;
}

/* Submenu */

#submenu {
	clear: both;
	padding: 20px 0;
	background: #535657 url(images/img16.gif) repeat-x left bottom;
	color: #A9B6BB;
}

#submenu ul {
	width: 770px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	line-height: normal;
}

#submenu li {
	display: block;
	float: left;
	width: 180px;
	padding: 0 12px 0 0;
}

#submenu li ul {
	width: auto;
	margin: 0;
}

#submenu li li {
	display: list-item;
	float: none;
	width: auto;
	padding: 5px 0 5px 10px;
	background: url(images/img17.gif) no-repeat left center;
	border-bottom: 1px solid #424546;
}

#submenu h2 {
	margin: 0 0 5px 0;
	border-bottom: 2px solid #424546;
	font-size: 1.2em;
}

#submenu a {
	text-decoration: none;
	color: #A9B6BB;
}

#submenu a:hover {
	text-decoration: underline;
}

/* Footer */

#footer {
	padding: 40px 0;
	background: #3F4244 url(images/img18.gif) repeat-x;
}

#footer p {
	text-align: center;
	font-size: smaller;
	color: #666666;
}

#footer a {
	color: #666666;
}

template staat op www.taxi-rhenen.nl als het niet duidelijk is
 
Laatst bewerkt door een moderator:
verduidelijken

Kun je wat duidelijker zijn in je vraagstelling?

Wat wil je precies bereiken?
 
En dat wil je via een stylesheet?

Waarom hang je niet een extra div in de html code?
 
wil het zelfde als de Two Columns maar krijg het niet voor elkaar.
 
Maar column-one is gewoon een subclass van two-columns.

De bijbehorende div "recent-posts" heeft als class 'column-one'

Je zult dus wel een extra div in je code moeten maken met een subclass van wide-post, als dat is wat je wilt.

Via CSS bepaal je niet de objecten in je html pagina, maar puur de opmaak ervan.
 
Even een tip qua forum-gebruik: Plaats je code op het forum gebruik dan de juiste tags :)

[js] voor JavaScript
HTML: 
 voor HTML
[php] voor PHP
en voor het andere [code]
[/noparse]
 
Geef gewoon ook eens de html dan zien we wat we er kunnen mee doen, met die css alleen kan je niet veel aanvangen tenzij je zelf de html pagina begint te schrijven en dat is nu voor mij nu net iets te veel gevraagd.
Mvg
Defietser
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan