Design Iceblue Bildschirmfüllend :

4 Tabellen und 6 Tabellenspalten müssen Ihre Breite mit Prozente-Angabe bekommen.

Iceblue wird dann für alle Bildschirmauflösungen in voller Breite angezeigt.

• hier die 4 Tabellen und 6 Tabellenspalten
• Code einfügen im Feld : "Text über Design"

Das Design wird nun für alle Bildschirmauflösungen in voller Breite angezeigt.
Von body (Hintergrund hinter Design) sehen Besucher nichts.
Ein Hintergrundbild (für body) wird also nicht gesehen / nicht benötigt !


Bitte nur diese 2 Werte anpassen :

td.edit_navi_headbg{width: 10% !important;}
td.edit_rechts_bottom{width: 10% !important;}

- Beide müssen die gleiche Prozentezahl bekommen !
- Beide bitte NICHT höher als 15% !
- Ideal ist 10%
- Besucher mit 1024 x 768 Bildschirm haben sonst Scrollbalken in der Breite

---

Bitte beachten :

Diese Felder verbreitern sich : Das Headerfeld oben der Streifen über Textfeld das weiße Textfeld Streifen unten im Textfeld der Balken unter Textfeld das dunkle Feld unter / hinter dem Textfeld Bild rechts anklicken

Tipp:

Wer kein Bildprogramm besitzt oder im erstellen von passenden Bildern ungeübt ist ,
der sollte diesen Klassen eine Hintergrundfarbe geben. Das Textfeld zum Beispiel weiße Hintergrundfarbe statt weißes Bild .

Beispiel für das Textfeld :

.edit_content {
   background:  none #FFFFFF; }

• background: ist der Hintergrund
• bei none     die Klammer leer lassen
• damit wird Original-Bild ausgeblendet, Wunschfarbe kann angezeigt werden
• #FFFFFF ist die gewünschte Farbe

---

Problem mit dem Header :

Besucher mit 1024 er Bildschirmauflösung sehen ca 1000 Pixel breites Header-Feld.
Besucher mit 1440 er Bildschirmauflösung sehen ca 1400 Pixel breites Header-Feld.
Hintergrundbilder / Grafiken können sich nicht anpassen !

Hier hilft die CSS3 Eigenschaft "background-size". Hintergrundgrafiken passen sich dann jeder Breite an. Es muss allerdings ein ausreichend großes Bild verwendet werden. Sonst werden sie sichtbar unscharf, wenn zu hohe Bildschirmauflösungen genutzt werden.

.edit_header_full benötigt folgende Eigenschaften :

   background: url(Grafikadresse) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   -khtml-background-size: cover;
   -ms-background-size: cover;
   background-size: cover; 

Beachtet beim Verbreitern des Designs auch den Seiteninhalt:
Besucher mit unterschiedlichen Bildschirmauflösungen sehen auch das Textfeld mit unterschiedlichen Breiten. Die Platzierung des Inhalts ist nun von der Bildschirmgröße der Besucher abhängig.

---