Producer Responsive

Linie unter dem Header

Bei der Verwendung einer Hintergrundgrafik wird unter dem Header eine unschöne Linie sichtbar. Mit diesem Code könnt ihr diese ausblenden.

CSS-Code anzeigen

<style>


#header {border-bottom: none;}

</style>

Farbe der Bullets im Header

Manchmal passt die Voreingestellte Farbe der Bullets im Header nicht zu der Grafik im Header. Mit diesem Code könnt ihr die Farbe der Bullets ändern.

CSS-Code anzeigen

<style>


.flex-control-paging li a{
background: white !important;
}
.flex-control-paging li a.flex-active{
background: darkgray !important;
}

</style>

Weiter-Butten der Kopfgrafik

In der Grundeinstellung ist die Kopfgrafik in diesem Layout ziemlich breit eingestellt und die Weiter-Button sind am Browserrand positioniert. Mit diesem Code könnt ihr die Position der Button anpassen sowie eigene Buttons festlegen.

CSS-Code anzeigen

<style>

.flex-direction-nav li a {

width: 50px;

height: 50px;

background: url(http://zella.de/bilder/hg/nav.png) no-repeat 0 0;

}

.flex-direction-nav li .prev, .flex-direction-nav li .flex-prev {

margin-left: -510px;

left: 50%;

}

.flex-direction-nav li .next, .flex-direction-nav li .flex-next {

margin-left: 460px;

left: 50%;

}

</style>

Navigation Fett

Um die Verweise der Navigation besser leserlich zu gestalten kann es Sinn machen diese Fett darzustellen.

CSS-Code anzeigen

<style>


.navbar .nav > li > a {
font-weight: bold;
}

</style>

Navigations-Button Mobile

Je nach Layoutanpassung kann es sein das der Button für die Mobile Navigation schlecht zu erkennen ist. So könnt ihr den Button eine andere Farbe verpassen.

CSS-Code anzeigen

<style>


.navbar-inner button.btn-navbar
{
background: #006600;
}

</style>