horizontaler scrollalken im theme … :/

herrfischer

bastele gerade ein theme und da habe ich das problem das wenn man das browserfenster zusammenzieht dann kommt ein horizontaler scrollbalken bevor das design umspringt auf die für 1024 optimierte version. mach ich da einen denkfehler? prozentwerte stimmen doch …

PHP

#wrapper {
    width:100%;
    background:#ccc;
    padding-top:2%;
}
#container {
    margin:0 auto;
    width:1100px;
}


#header {
    width:100%;
    background:#efefef;
    margin-bottom: 2%;
    height:150px;
}
#footer{
    width:100%;
    background:#efefef;
    margin-top: 2%;
    height:70px;
}
#content {
    float:left;
    width:56%;
    margin-right:2%;
    background:#efefef;
    height:800px;
}


#sidebar1 {
    float:left;
    width:20%;
    margin-right:2%;
    background:#efefef;
    height:800px;
}


#sidebar2 {
    float:left;
    width:20%;
    background:#efefef;
    height:800px;
}




@media only screen and (max-width: 1024px) {


#container { width:100%; }


#content { width:78%; }


#sidebar1 {
    width:20%;
    margin-right:0;
    margin-bottom:2%;
}


#sidebar2 {
    width:100%;
    height:200px;
}


}

Alles anzeigen

anbei das ganze theme als zip: download

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

herrfischer

habs jetzt gelöst indem ich folgendes hinzugefügt habe:

PHP

@media only screen and (max-width: 1280px) {


#container {
    margin:0 auto;
    width:960px;
}


#content { width:56%; }


#sidebar1 {
    width:20%;
    margin-right:2%;
    margin-bottom:2%;
}


#sidebar2 {
    width:20%;
    height:800px;
}


}

Alles anzeigen

so gehts erstmal … oder geht das schlauer?

JakoThAn

Moin,

HTML

overflow: hidden; /*keine Balken*/
overflow: scroll; /*macht Balken*/

Es bietet sich immer an mit overflow´s zu arbeiten, wenn man "dynamische" Breiten / Höhen verwendet.

http://www.css4you.de/overflow.html
http://webdesignerwall.com/tutorials/css-…s-with-overflow

Thomas

cebito

Zitat von JakoThAn

Es bietet sich immer an mit overflow´s zu arbeiten, wenn man "dynamische" Breiten / Höhen verwendet.

Nö, muss man nicht.

@TE:

#container{width:1100px;} ... die hat er, bis der Viewport 1024 oder kleiner ist ;)

Ach ja, width:100%; für Blockelemente ist sinnlos, da sie die sowieso einnehmen, solange du nichts anderes vorgibst.

Willkommen! Melden Sie sich an oder registrieren Sie sich.

horizontaler scrollalken im theme … :/

Jetzt mitmachen!