Detlef G.: Dreiteiliger vertikaler Background

Beitrag lesen

Hallo Thrust

Mein Design für den Hintergrund ist (etwas übertrieben) in einer Rautenform.
Diese Form habe ich in 3 .png images verwandelt: die obere Hälfte, ein 1px-Streifen aus der Mitte (für repeat-y) und die untere Hälfte.

Eventuell ist der 1px Steifen nicht nötig bzw. kompliziert es zusätzlich. PNG-Dateien werden oft nur unwesentlich größer, wenn die Bildgröße durch eine wiederholende Struktur größer wird.

Ich hoffe ich habe das jetzt nicht zu unverständlich erklärt :)

Verständlich ist es schon.
Trotzdem wäre es hilfreich, einen Link auf die Seite zu posten, oder wenigstens die Hintergrundbilder mitzuliefern.

CSS:

#container {
  width: 900px;
  overflow: hidden;
  position: relative;
  left: 50%;
  top: 0px;
  margin-left: -450px;
}

  
Das halte ich für die ungünstigste Variante einer horizontalen Zentrierung. Bei zu schmalen Browserfenstern kann dadurch ein Teil unerreichbar links außerhalb des Fensters verschwinden.  
Besser ist es einfach mit margin:auto zu zentrieren (eventuell für alte IEs noch text-align:center im Elternelement).  
  

> ~~~css

#content_con {  

>   width: 100%;  
> }

Ist das nötig? Blockelemente nehmen standardmäßig die gesamte zur Verfügung stehende Breite ein.

Ich würde mich freuen, wenn jemandem eine schlaue Lösung einfällt, …die um eine .jpg oder .gif als png ersatz herumkommt (das würde mein Design völlig zerstören).

Die dürfte es mit Hilfe von negativen Margins geben.

Auf Wiederlesen
Detlef

--
- Wissen ist gut
- Können ist besser
- aber das Beste und Interessanteste ist der Weg dahin!