Webboard

wersja skryptu MyBB:1.8.3
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu):
Nie wiem jak poszerzyć obszar ".wrapper" w stylu Squere.

Witam, chciałem zmienić szerokość klasy ".wrapper" i ".forums" w stylu squere do mybb 1.8.*.
Normalnie wartość wrappera wynosi "width:984px; min-width:984px;", a forums "width:984px" lub "width:"724px".
Całość jest sterowana tym skryptem:

Kod:
<script type="text/javascript">

  jQuery(function($) {

    $(".clickedbuttons").hide();

    $(".buttons").click(function() {

        $(".sidebar").animate({height: "hide", opacity: 0}, 500,

            function() {

                $(".forums").animate({width: "984px"}, 500);

            });

        $(this).hide();

        $(".clickedbuttons").show();

        $.cookie("sidebar","collapsed", {expires: 365});

        return false;

    });

    $(".clickedbuttons").click(function() {

        $(".forums").animate({width: "724px"}, 500,

            function() {

                $(".sidebar").animate({height: "show", opacity: 1}, 500);

            });

        $(this).hide();

        $(".buttons").show();

        $.cookie("sidebar","expanded", {expires: 365});

        return false;

    });

    if($.cookie("sidebar") == "collapsed") {

        $(".buttons").hide();

        $(".clickedbuttons").show();

        $(".forums").css("width","984px");

        $(".sidebar").hide();

    }    

});

</script>

Kod:
.wrapper {

    width: 984px;

    margin: 0 auto;

    padding: 0 20px;

      min-width: 984px;

}

Jak widać skrypt zmienia rozdzielczość ".forums" i chowa lub pokazuje ".sidebar", gdy się kliknie odpowiedni przycisk.

Chcę wrappera poszerzyć tak aby wraz z wnętrzem zajmował co najmniej 80% obszaru ekranu, tabelka ".forums" była również odpowiednio szeroka.

Problem jest taki, że jak wrappera ustaiwię na szerokość 80% i min-width:80%, a w skrypcie JQ przestawię wszystko również na odpowiednie wartości procentowe, to ogólnie skalowanie tych tabelek i wrappera jest właściwe, ale tylko na panoramicznej rozdzielczości. Gdy zacznę zmieniać rozmiar przeglądarki, to tabelka ".sidebar" wskakuje nad tabelkę ".forums", bo powstają dysproporcje i się one nie mieszczą, a wszystko przez te %. Chcę aby zawsze, bez względu na rozdzielczość tabelki wyświetlały się poprawnie obok siebie. Ogólnie wiem dlaczego tak się dzieje, bo w ogóle te procenty mieszają wszystko, ale jak wymuszę rozmiar w pixelach, to np. w telefonie tabelki będą za szerokie, wyskoczą z wrappera.

Czy wiecie jak to poszerzyć bez wspomnianych problemów?

Strasznie namieszałeś, nie wiem czy dobrze rozumiem, ogólnie szerokość ustawiasz w global.css, przyjmijmy 1400px, przechodzisz do indexu i masz tam szerokość forum i sidebaru, czyli jeści ustawisz sidebar na 300px forum ustawiasz na 1090px(10px przerwy) - przynajmniej ja tak robiłem jak miałem ten styl.
Global.css> wrapper - szerokość całości
Index> szerokość forum i sidebaru (uwzględnij przerwe np. 10px)

Dobra udało mi się, już kombinowałem tak jak pisałeś, ale wtedy mi się zwyczajnie źle wyświetlało np. na telefonie, dlatego napisałm wątek, a trzeba było jeszcze ustawić szerokość .header { min-width:1430px; } i tak samo .panel w arkuszu squere.css i adekwatnie, to co jest w stopce oraz innych miejscach np w .footer, czy .copyright.

Koniecznie musiałem dopisać też w kodzie JQ na samym dole:

Kod:
else

    {

        $(".buttons").show();

        $(".clickedbuttons").hide();

        $(".forums").css("width","1090px");

        $(".sidebar").css("width","300px");

        $(".sidebar").show();

    };

Bo ogólnie szerokość zmieniałem z poziomu szablonów, gdyż wszystkim można sterować za pomocą JQ, a w arkuszach i szablonach nie widziałem regulacji klasy "forums" i "sidebar" poza tym skryptem, chyba, że nie szukałem we właściwym szablonie.

zamiast na px trzeba było operować na % i nie musiałbyś nic dopisywać. Style są pisane tak, by wyświetlały się prawidłowo na smarcie czy panoramie.

Swordancer

Bartek09

Swordancer

LikeLoveHate