Layout

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Antworten
Tiff
Mitglied
Beiträge: 16
Registriert: 02.07.2007 08:58

Layout

Beitrag von Tiff »

Hallo,

ich bin fast fertig mit meinem Layout.
Der Beitrag hat fast alle meine Probleme gelöst.

http://www.phpbb.de/viewtopic.php?t=148 ... ght=breite

Doch jetzt komme ich nicht mehr weiter, es ist mit Sicherheit total einfach ich komme aber nicht auf die Lösung.

Um es besser erklären zu können habe ich ein Bild angefügt.

Bild

Es geht einfach darum den Abstand zwischen dem Rand ( blau ) und dem Forum zu verringern.

Ich hab schon einiges ausprobiert komme aber zu keiner Lösung.
Das Layout ist aufgebaut auf dem subSilver2.

/* Layout
------------ */
* {
/* Reset browsers default margin, padding and font sizes */
margin: 0;
padding: 0;
}

html {
font-size: 100%;
}

body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
color: #ffffff;
background-color: #2e2e2e;
font-size: 62.5%; /* This sets the default font size to be equivalent to 10px */
margin: 5px 5px 5px 5px;
padding: 0px;
border-color: #0000ff;
border-width: 1px 1px 1px 1px;
border-style: solid;
width: 950px;
margin-left: auto;
margin-right: auto;
}

#centerthis {
padding: 0 20px;
width: 900px;
/* zum mittig machen folgendes noch */
margin-left: auto;
margin-right: auto;
}

#wrapheader {
min-height: 120px;
height: auto !important;
height: 120px;
/* background-image: url('./images/background.gif');
background-repeat: repeat-x;*/
/* padding: 0 25px 15px 25px;*/
padding: 0;
}

#wrapcentre {
margin: 15px 25px 0 25px;
}

#wrapfooter {
text-align: center;
clear: both;
}

#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;
}

Kann mir wer sagen an welchem Rad ich drehen muss damit es klappt?

Der Link zum neuen Forum: www.blue-steel-warriors.de/bsw
Der Link zum alten Forum: www.blue-steel-warriors.de/forum
Das neue Forum soll dann ähnlich aussehen.

bye
Benutzeravatar
x16
Mitglied
Beiträge: 472
Registriert: 03.11.2005 22:35
Wohnort: Hamburg
Kontaktdaten:

Beitrag von x16 »

Also mal abgesehen vom Problem, finde ich den blauen Rand optisch nicht schön. Auch die Farbe des Randes selber ist meiner Meinung nach zu grell. Lass ihn lieber weg oder nehme als Farbe ehe so ein Ton: #1C64D8.


Ich benutze ProSilver, deshalb ist es für mich jetzt schwer auf SubSilber2 umzudenken, auch wenn der Code ähnlich ist. Aber du solltest mal Probieren die Weite des Bodys zu verkleinern:

Code: Alles auswählen

body { 
width: 920px; 
}
Tiff
Mitglied
Beiträge: 16
Registriert: 02.07.2007 08:58

Beitrag von Tiff »

Das habe ich auch schon versucht.

Dann sieht es so aus:

Bild

Der rechte Rand verändert sich und rückt näher, links tut sich aber gar nicht.

bye
Razor5655
Mitglied
Beiträge: 42
Registriert: 25.12.2007 17:25
Wohnort: Gerstetten

Beitrag von Razor5655 »

Der Thread ist zwar etwas alt aber ich hab die lösung:

Code: Alles auswählen

body {
/* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
font color: #000000
color: #ffffff;
background-color: #ffffff;
font-size: 62.5%; /* This sets the default font size to be equivalent to 10px */
margin: 5px 5px 5px 5px;
padding: 0px;
border-color: #000000;
border-width: 1px 1px 1px 1px;
border-style: solid;
width: 920px;
margin-left: auto;
margin-right: auto;
}

#centerthis {
padding: 0 0px;
width: 920px;
/* zum mittig machen folgendes noch */
margin-left: auto;
margin-right: auto;
}

#wrapheader {
min-height: 120px;
height: auto !important;
height: 120px;
/* background-image: url('./images/background.gif');
background-repeat: repeat-x;*/
/* padding: 0 25px 15px 25px;*/
padding: 0;
}

#wrapcentre {
margin: 0px 0px 0 0px;
}

#wrapfooter {
text-align: center;
clear: both;
}

#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;
} 
du musst die Farben nurnoch anpassen
Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“