FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Zur Registrierung

Thema: Weisser Rand in CSS vom 28.08.2011

	MGi Foren-Übersicht -> Allgemeines - Nonprint -> Weisser Rand in CSS

Autor

Nachricht

tbny
Threadersteller

Dabei seit: 28.08.2011
Ort: -
Alter: -
Geschlecht: -

Verfasst So 28.08.2011 12:33
Titel

Weisser Rand in CSS

Ich werde noch verrückt, bin nicht der wirkliche Coder aber ich möchte unbedingt auf meiner Homepage www.tbny.de einen weissen rand links und rechts über die komplette Seite.

Wie mach ich das in meinem CSS style file?

Hier mein Code:

Code:

* {
margin: 0;
padding: 0;
}

body {
padding-bottom: 30px;
font: 14px Arial, Helvetica, sans-serif;
color: #B6B4B3;
background: #000000;
}

h1 {
padding: 120px 0 0 30px;
font: normal 40px Georgia, Times, serif;
color: #FFFFFF;
}

h1 a, h1 a:hover {
color: #FFFFFF;
text-decoration: none;
}

h2 {
font-weight: normal;
text-shadow: -1px 1px 1px #343332;
}

p {
padding: .8em 0;
line-height: 1.4em;
text-align: justify;
}

p#subtitle {
padding: 0 0 0 30px;
font-size: 14px;
text-transform: uppercase;
color: #A5957D;
}

a {
color: #B09B7D;
text-decoration: underline;
}

a:hover {
color: #C2B39C;
}

/* page */

#page {
width: 950px;
margin: 0 auto;
}

/* header */

#header {
height: 220px;
background: url('images/header_11.jpg') no-repeat right top;
}

/* menu */

#menu {
height: 102px;
text-align: center;
background: #776853 url('images/menu_14.jpg') no-repeat top;
}

#menu ul {
list-style: none;
}

#menu ul li {
display: inline;
font-size: 14px;
line-height: 72px;
}

#menu ul li a {
padding: 0 30px;
text-shadow: 1px -1px 1px #525A3E;
text-decoration: none;
color: #DDD6CD;
}

#menu ul li a:hover {
color: #FFFFFF;
}

/* main */

#main {
background: url('images/main_11234.jpg') no-repeat bottom;
}

/* sidebar */

#sidebar {
float: left;
width: 305px;
font-size: 14px;
}

#sidebar #login, #sidebar .box {
margin-bottom: 5px;
padding-bottom: 5px;
background: url('images/box_11.jpg') no-repeat bottom;
}

#sidebar .box2 {
height: 1%;
padding: 20px 30px;
background: #384E92 url('images/box_1123.jpg') no-repeat top;
}

#sidebar h2 {
padding: 0 10px 0 30px;
font-size: 20px;
line-height: 64px;
background: #474543 url('images/h2_11.jpg') no-repeat;
}

#sidebar ul {
list-style: none;
}

#sidebar ul li {
padding: .25em 0 .25em 20px;
line-height: 1.0em;
background: url('images/arrow.gif') no-repeat 0 .3em;
}

#sidebar ul li a {
padding: 0;
text-decoration: none;
}

/* login */

#login h2 {
font-size: 20px;
line-height: 52px;
height: 58px;
background: #474543 url('images/loginh2_112.jpg') no-repeat;
}

#login form {
text-align: center;
}

#login form p {
padding: 5px 0;
text-align: center;
}

#login form p.txtleft {
padding: 15px 0 5px 35px;
text-align: left;
}

#login form p.rem {
padding-top: 15px;
}

#login input.text, #login input.password {
padding: 4px;
width: 190px;
font-size: 13px;
color: #444444;
background: #E9E8E8;
border: 1px solid #A0A09C;
border-left: 1px solid #C4C4C1;
border-bottom: 1px solid #C4C4C1;
}

#login input.submit {
margin: 10px 0;
width: 100px;
height: 31px;
color: #CEC5B8;
background: #625542 url('images/submit.jpg') no-repeat;
border: none;
cursor: pointer;
}

/* content */

#content {
float: right;
width: 625px;
padding-bottom: 10px;
margin-bottom: 15px;
background: url('images/content_11.jpg') no-repeat bottom;
}

#content #contheader h2 {
height: 58px;
padding-right: 30px;
font-size: 20px;
line-height: 52px;
text-align: right;
background: #474543 url('images/contenth2_112.jpg') no-repeat;
}

#content2 {
height: 1%;
padding: 40px 30px 10px 30px;
background: #384E92 url('images/content_112.jpg') no-repeat top;
}

#content .post {
padding: 0 0 50px 0;
}

#content2 h2 {
font-size: 18px;
text-shadow: none;
}

#content h2 a {
text-decoration: none;
color: #B6B4B3;
}

p.postmeta {
padding: .4em 0;
color: #8B8988;
}

#content .entry {
padding: 20px 0 0 0;
}

.clearing {
clear: both;
height: 1px;
overflow: hidden;
}

/* footer */

#footer {
padding: 40px 30px 80px 30px;
}

#footer p {
font-size: 11px;
text-align: center;
text-transform: uppercase;
color: #7C7C7C;
}

#footer a {
text-decoration: none;
}

Zuletzt bearbeitet von Nimroy am So 28.08.2011 12:34, insgesamt 2-mal bearbeitet

Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich

Verfasst So 28.08.2011 13:25
Titel

Code:

body{ background: #fff; } #page{ bacground: #000; }

kramsen

Dabei seit: 06.12.2008
Ort: im Anschnitt
Alter: -
Geschlecht: Männlich

Verfasst Mo 29.08.2011 08:56
Titel

Bzw.

Code:

body {

border-left-width: 5px;
border-left-style: solid;
border-left-color: #fff;
border-right-width: 5px;
border-right-style: solid;
border-right-color: #fff;

}

Mac

Dabei seit: 26.08.2005
Ort: Köln
Alter: 62
Geschlecht: Männlich

Verfasst Mo 29.08.2011 09:35
Titel

Smooth-Graphics hat geschrieben:

Code:

body{ background: #fff; } #page{ background: #000; }

tippex

Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich

Verfasst Mo 29.08.2011 10:33
Titel

Mac hat geschrieben:

Smooth-Graphics hat geschrieben:

Code:

body{ background: #fff; } #page{ background: #000; }

tippex

Danke dir. Mein "k" klemmt ab und an…

@kramsen: Nein, er will den ganzen BG weiß außer die Seite selbst.

SimonDerDude

Dabei seit: 15.01.2010
Ort: error: undefined
Alter: 35
Geschlecht: Männlich

Verfasst Mo 29.08.2011 10:56 Titel

Das Thema hat Chris auf seiner Webseite mal breit getreten: css-tricks.com


	MGi Foren-Übersicht -> Allgemeines - Nonprint

Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.