Feste mittlere Breite, variable Seiten mit Inhalt

neulandhb

Hi Leute,

ich habe ein Problem mit meiner Seite. benutze das TwentyTen Theme als reines CMS.

hier ist die Seite >>><<<

und ein Bild zur Veranschaulichung, wie es aussehen soll.

Mein Problem ist, dass ich eine feste Breite in der Mitte mit variablen Seiten bis zum Rand gefüllt mit einem gif haben möchte und ich es einfach so nicht hinbekomme.

Kann mir jemand helfen?

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

cebito

Mit css3 geht das, verstehen nur noch lang nicht alle Browser:

HTML

<!doctype html>
<html>


<head>
    <title>Variabel/Fest</title>


    <meta charset="UTF-8" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
<style type="text/css">
html, body, div{margin:0; padding:0;width:100%}
#links, #mitte, #rechts {float:left;height:500px;}
#links{width:calc(60% - 310px);background:#333;}
#mitte{width:620px;background:#0f0;}
#rechts{width:calc(40% - 310px);background:#ff0;}
</style>
</head>


<body>
<div id="links"></div><div id="mitte"></div><div id="rechts"></div>
</body>
</html>

Alles anzeigen

Ich würd dir allerdings raten, das jQuery, was du zum scalieren des Hintergrundbildes benutzt dafür zu erweitern.

neulandhb

danke Dir,

habe Dein html-File unter Firefox, Chrome, Safari und Opera ausprobiert und das funktioniert leider nicht.

cebito

Zitat von neulandhb

danke Dir,
habe Dein html-File unter Firefox, Chrome, Safari und Opera ausprobiert und das funktioniert leider nicht.

Wie gesagt ist das css3 und in der Form macht das nur der IE9 richtig.
http://www.abload.de/image.php?img=unbenannt-2unvg.jpg http://www.abload.de/image.php?img=unbenannt-2unvg.jpg
Hab zwar gelesen, das es für den FF ein -moz-calc geben soll, aber das funktioniert wohl dann auch erst im 4er.

Naja, wie bereits oben gesagt, wirst du das mit Javascript lösen müssen. Das hier war nur ein Ausblik wie es mal gehen wird.

cebito

Hab dir mal ein Beispiel gebaut: http://www.cebito.de/examples/variabel/

neulandhb

vielen, vielen dank cebito.

die variablen Seiten sind so, wie sie sein sollen:-)

hatte mich viel zu lange daran aufgehalten.

cebito

Zitat von neulandhb

vielen, vielen dank cebito.
die variablen Seiten sind so, wie sie sein sollen:-)
hatte mich viel zu lange daran aufgehalten.

Schon wieder ein bisschen besser, eben sah es noch anders aus ;)

Hab dir nochmal speziell auf dein Bild hin was on gestellt http://www.cebito.de/examples/variabel/

neulandhb

wow, danke Dir!

Mit dem Start-Button ist klar, dass es dann ein Bild sein muss und den Textinhalt werde ich dann einfach in ein Artikel legen und in keiner Seite, sonst wird es zu kompliziert.

Ich habe die div-elemente ein wenig anders aufgebaut.
Leider finde ich für die oberen Buttons in meiner CSS nirgends die Höhe der Buttons, damit der Text dann vertikal zentriert ist. Mit Web Developer sieht man ja alles aber Änderungen mit Firebug haben keine Auswirkung.

Danke noch einmal für deine große Hilfe.

cebito

Zitat von neulandhb

Leider finde ich für die oberen Buttons in meiner CSS nirgends die Höhe der Buttons, damit der Text dann vertikal zentriert ist.

Code

#access a {
    color: #aaa;
    display: block;
    line-height: 38px;
    padding: 0 10px;
    text-decoration: none;


}

Die "line-height: 38px;" muss da raus... und dafür änderst das Padding auf "padding: 4px 10px;" einfach probieren wie es dir am besten gefällt.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

Feste mittlere Breite, variable Seiten mit Inhalt

Jetzt mitmachen!