Box Abstand ändern

Author: Ing. Michael Fürst (m.fuerst@bluegate.at)
Web: http://www.bluegate.at
Publiziert: April 2007

Problemstellung

Sie möchten den vertikalen Abstand der Box-Elemente an der linken und rechten Seite verändern.

Lösung

Um den Abstand der Boxen an der rechten und linken Seite des Shop-Fensters zu variieren, ist nur ein kleiner Eingriff in das mitgelieferte Stylesheet (CSS) nötig.

Öffnen Sie das Stylesheet und suchen Sie darin folgenden Abschnitt:

/* BOXES GLOBAL DEFINITION */
h2.boxheader {background-image:url(img/bg_boxheader.gif);height:25px;font-size:11px; color:#FFFFFF; padding:0px 8px 0px 8px; margin:0; line-height:25px; vertical-align:middle;}
h2.boxheader a:link, h2.boxheader a:hover, h2.boxheader a:active, h2.boxheader a:visited {text-decoration:none; color:#ffffff}
.boxbody {background-color:#ECE9E2; padding:8px; margin-bottom:15px}
.boxbody h3, .boxbody h3 a {font-size:11px}
.boxbody h3.center, .boxbody h3.center a {font-size:11px; text-align:center}

In diesem Abschnitt finden Sie die Klassendefinition ".boxbody {back....}". In dieser Zeile befindet sich auch die Deklaration des Abstandes nach einem Box Element in Form einer "margin-bottom" Angabe.

Standardmäsig sind hier 15 Pixel (15px) definiert. Ändern Sie diesen Wert nun nach Belieben (z.B.: margin-bottom:10px), speichern Sie die Datei und laden Sie das Stylesheet wieder auf Ihren Shop-Server.