/CSS. Zusätzliches Element mit HG-Bild und Semantik

[Kai345]

[latex]Mae  govannen![/latex]

Da meine Kopfschmerzen schon wieder zunehmen, denke ich evtl. gerade nicht mehr ganz so klar (falls dem überhaupt mal so sein sollte) und übersehe vielleicht eine Methode:

Folgendes: Ich habe einen immer gleichen Container, der den jeweiligen Inhalt einer Seite aufnimmt. Dieser Container kann ggf. eine (gekachelte) Hintergrundgrafik haben. Nun möchte ich zusätzlich auf einigen Unterseiten positioniert ein reines Zierbild einfügen, da jedoch mehrere Hintergrundbilder (noch) nicht möglich sind, habe ich dazu, soweit ich es sehe, zwei Möglichkeiten.

<div id="inhalt">  
  <img id="zusatz_zierbild" src=  usw. >  
  Inhalte  
</div>

Nachteil: Element hat eine semantische Bedeutung, ist selektierbar und auch ohne CSS vorhanden und hängt dann aussagelos (insbesondere bei Readern) in der Gegend herum, ist also eine eher schlechte Lösung.

ODER

<div id="inhalt">  
  <span id="zusatz_zierbild">&#xA0;</span>  
  Inhalte  
</div>

und dies per CSS (background-image) entsprechend gestalten

Nachteil: (Quasi-)leeres Element, dem man die Bedeutung und Funktion _im Quelltext_ nicht ansieht, ohne es entsprechend zu kommentieren bzw eine sprechende id/klasse zu vergeben.

Dennoch halte ich Lösung zwei für wesentlich sinnvoller.

Da der Inhalt-Container schmaler ist als das übergeordnete Element, kann ich auch nicht dem Eltern-Element die Kachelung geben und mit einem positionierten Bild im Container arbeiten.

Oder übersehe ich jetzt eine andere Lösung? Gibt es weitere Nachteile, die ich nicht sehe?

Cü,

Kai

[ChrisB]

Hi,

Nachteil: (Quasi-)leeres Element, dem man die Bedeutung und Funktion _im Quelltext_ nicht ansieht, ohne es entsprechend zu kommentieren bzw eine sprechende id/klasse zu vergeben.

So what ...

Dennoch halte ich Lösung zwei für wesentlich sinnvoller.

Ich auch.
Lass die Webstandards-Evangalisten sich meinetwegen von den aufgerollten Zehennaegeln die Augen auspieken - und den Pragmatismus siegen.
CSS hat noch so viele Unzulaenglichkeiten, dass es eben manchmal Workarounds braucht, auch wenn sie unschoen sind.

MfG ChrisB

[Cheatah]

Hi,

CSS hat noch so viele Unzulaenglichkeiten, dass es eben manchmal Workarounds braucht, auch wenn sie unschoen sind.

in vielen Fällen ist das nicht mal nötig, wenn man mit HTML modular umgeht - was fast zwangsläufig zu mehr Elementen führt. Ich verwende beispielsweise gerne für die "großen" Container einer Seite folgende Konstruktion:

  
<div id="fooContainer">  
    <div class="skip"><a href="#eoFoo">Foo-Bereich überspringen</a></div>  
    <div id="foo">  
        ...  
    </div>  
    <div id="eoFoo"><hr/></div>  
</div>  

Das ist sinnvoll für textbasierte Clients, und auch wenn ich die Bedeutung von <div> hier sicher recht weit auslege, halte ich es noch[1] für semantisch. Der Vorteil ist zudem, dass man solche Bereiche ziemlich gut automatisiert herstellen kann. Ein willkommener Nebeneffekt ist, dass man mehr Elemente zur Formatierung zur Verfügung hat.

Cheatah

[1] Ein einzelnes Element zu gruppieren erscheint zwar schwer ;-) aber es sind wesentliche Seitenbereiche.