..:: technologie online ::..

Beispielsweise für Tunnelseiten oder eigene DIV Container ist es wünschenswert, die DIV Container zu zentrieren. Ein zusätzlicher Effekt sorgt dafür, dass solche Boxen auch transparent sind, ohne dass mit transparenten Grafiken gearbeitet werden muss. Hier der CSS Code-Schnipsel, die einzelnen CSS Bereiche werden im Hauptteil des HTML-Dokuments dann entsprechend aufgerufen.

Entsprechender CSS Code im HEAD Bereich der Webseite:

<style type=”text/css”>
body
{
background-image: url(‘/images/background.jpg’);
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
}

div.transbox
{
height:500px;
width:400px;
position:absolute;
margin:-200px 0px 0px -250px; (<– Hälfte der Werte der oberen Maße der Box)
top: 50%;
left: 50%;

background-color:#ffffff;
border:1px solid white;
/* for IE */
filter:alpha(opacity=60);
/* CSS3 standard */
opacity:0.6;
}
div.transbox p
{
text-align:center;
margin:10px 20px;
color:#000000;
font-variant:small-caps;
font-size:100%;
}

div.transbox a
{
text-align:center;
margin:10px 20px;
color:#000000;
font-variant:small-caps;
font-size:100%;
}
</style>

Je nach weiteren Elementen, die verwendet werden, können noch zusätzliche Sektionen und Klassen eingebaut werden.