fhs-simple ==> Breite des Lesebereichs einstellen

[andy027]

Guten Tag,
weiß jemand wie/wo man die Breite des zentralen Lesebereichs vergrössern kann?
Die Breite des vertikalen Navigationsbereichs soll nach Möglichkeit nicht verändert werden.
Ich verwende das template fhs-simple.

Viele freundliche Grüße aus Wuppertal,
Andreas

[frase]

weiß jemand wie/wo man die Breite des zentralen Lesebereichs vergrössern kann?
Die Breite des vertikalen Navigationsbereichs soll nach Möglichkeit nicht verändert werden.

Das Template verwendet ein kleines Grid-System, welches in grid.min.css festgelegt ist.
Damit du nicht dort herumändern musst, kannst du auch die Einstellungen im normalen stylesheet.css eintragen und überschreiben.

Der gesamte Inhaltsbereich befindet sich in einem DIV mit den Klassen "row" und "content".

Ergänze also in der stylesheet.css z.B. folgendes:

Code: Select all

.content {
    ...
    max-width: 1280px;
}

Damit sind beide Bereiche (linke Nav und Inhalt) insgesamt breiter.
Die linke Nav (secmenu) hat in template.htm die (Grid-)Klasse "c8".
Der Inhalt oder Lesebereich (maincont) hat in template.htm die (Grid-)Klasse "c16".
Das ergibt zusammen c8 + c16 = c24 also volle Breite.
Das Verhältnis dieser beiden Bereiche untereinander kannst du also mit diesen Grid-Klassen steuern.
Zum Beispiel: c4 + c20 = c24

Das Ganze hat noch Folgen für den Header und den Footer. Hier musst du die Breite dann auch noch ändern.

[andy027]

Hallo "frase",
vielen herzlichen Dank !!! Das hat geklappt.
Habe auch herausgefunden wie ich das horizontale menu entsprechend anpasse,
und zwar indem ich in der navi.css bei:
.nav_row {...
max-width: 1280px; }
setze.
Das sieht nun viel besser aus wie ich finde.

Nur..., wo/wie kann ich den Header, also das darin enthaltene logo und den Seitennamen dahinter auf die 1280px anpassen?
Das sollte nun weiter nach links rücken.

Viele freundliche Grüße,
Andreas

[frase]

Nur..., wo/wie kann ich den Header, also das darin enthaltene logo und den Seitennamen dahinter auf die 1280px anpassen?

Tja, der Header-Inhalt hat momentan die Klasse "row" - und die hat max-width: 980px.

Ändere diese Klasse in der template.htm:

Code: Select all

<div id="header" class="row-full-width"> ...
<div class="langMenu"> ...
<div class="row"> <!-- DIESE ZEILE ÄNDERN ZU: -->
<div class="headerInner">

Dann legst du eine neue Klasse in stylesheet.css an:

Code: Select all

.headerInner {
    max-width: 1280px;
    margin: 0 auto;
}

Das sollte es gewesen sein.

[andy027]

Funktioniert !!!
Super, super, SUPER !!! Dein Experten-Wissen und Deine präzisen Lösungen sind unglaublich gut.
Vielen herzlichen Dank, dass Du so schnell und unkompliziert hilfst !!!

Viele freundliche Grüße,
Andreas