Responsywność

wersja skryptu MyBB: 1.8.7
adres forum: forumgierek.ugu.pl
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): Posiadam styl DarkGame v1. Chciałem zrobić tak, aby ekran dostosowywał się do rozmiarów urządzenia. W responsive.css dodałem następujący kod:

@media 
only screen and (max-width: 734px),
(min-device-width: 550px) and (max-device-width: 1024px)  {
    .wrapper, #container {
        width:100%;
        min-width:100%;
    }
    ul.meni {
        height:auto;
    }
ul.meni li ul {margin-left: -40px;}
    ul.meni div {
        float:none!important;
    }
    ul.meni li {
        display:block;
        text-align:center;
        border-bottom: 1px solid #003857;
        line-height: 1;
    }
    #pole_szukaj {
        display:none;
    }
    #logo {
        text-align:center;
    }
    #logo .wrapper {
        display:inline-block;
    }
    #logo .wrapper table td:first-child {
        width:100%!important;
    }
    ul.menu_user {
        width:100%;
        margin:0;
        padding: 5px;
    }
    ul.menu_user li {
        display: inline-block;
        border: 1px solid #283D53;
        padding: 0;
        margin: 1px;
    }
#logo img {
max-width:100%!important;
}
.pgindexstats div {
display:block;
width:100%;
margin-bottom:5px;
padding:10px 0;
}
table, table.tborder {
overflow: scroll;
width: 100%;
}
#content {
overflow:auto;
}
.sidebar, .forums {
float:none!important;
display:block;
width:100%!important;
}
.trow1, .trow2 {
padding:3px;
}
iframe {
display:none;
}
.forumstats {
display:none;
}
.lastpostrow {
text-align:right;
}
.lastpostm {
display:none;
}
.lastpostcenter {
text-align:right!important;
padding-right:3px;
}
.smalltext {
font-size:10px;
}
#loginForm, #loginBox{width: 100%;}
.menu-panel_form ul li {border-bottom: 0px none;}
#loginForm {margin-top: 5px;}
.avatarTopdef2 {display: none;}
}

Dodatkowo do szablonu index dodałem metatag:

<meta name="viewport" content="width=device-width, initial-scale=1" />

Mimo to i tak ekran nie dostosowuje się do wielkości urządzenia, tylko (dzięki metatagu powyżej) odpowiednio skaluje, aby czcionka była czytelna. Jednak i tak trzeba przesuwać ekran w prawą lub lewą stronę. Proszę o pomoc.

Z id container musisz usunąć minimalną szerokość i z recent threads usunąć reklamę lub zrobić ją responsywną. Obecnie jest w niej podana szerokość na sztywno w pikselach.

Usunąłem z id container "min-width:100%;" (nie wiem czy dobrze zrobiłem, więc mi powiedz, czy tak) lecz nie mogę znaleźć recent threads.

Źle. Usunąłeś to sam nie wiem z czego i gdzie.

http://prntscr.com/br5usb

Teraz już sam się pogubiłem...

---

Źle. Usunąłeś to sam nie wiem z czego i gdzie.

http://prntscr.com/br5usb

Usunąłem z responsive.css

Usuń to z global.css (prościej ci będzie) lub zmień regułę w media queries (trudniej).

Jeśli chodziło Ci o usunięcie min-width... zobacz, jakie to jest wąskie...

Co jest wąskie? ctrl+f5 i wszystko gra.
Aby zrobić logo responsywne przerób to: http://www.w3schools.com/css/css_rwd_images.asp
Pozostaje ci jeszcze kwestia reklam. Możesz im dać display none, ale nie wiem jak to się ma z regulaminem ugu. Zapewne będziesz musiał ustawić imoverflow-x na scroll lub hidden (w zależności co chcesz z nimi zrobić).