Core Framework v1.4.0 – Documentation

Page Header – White

This section explains how to construct the white, lightweight ImmobilienScout24 header, which is used mostly for pages where the user should not be distracted from the content.

Usage

The white header has a simple structure. It contains only the ImmobilienScout24 logo, and a one- or two-line claim or headline.

It is fully responsive and will fit all common screen sizes.

White header (Background added for demonstrational purposes)
<header class="page-header page-header--white">
    <a href="/de/finden/wohnen/index.jsp" title="Zur Startseite" class="page-header__logo">
        <img alt="ImmobilienScout24" src="../../img/logo/immobilienscout24.svg">
    </a><span class="page-header__brand">
        Rein ins neue Leben.
    </span>
</header>

Please note that there should be no whitespace (line feeds, tabs, etc.) in your markup between the end tag of page-header__logo and the starting tag of page-header__brand.