Webboard

Pełna wersja: Użytkownik miesiąca - css i html
Aktualnie przeglądasz uproszczoną wersję forum. Kliknij tutaj, by zobaczyć wersję z pełnym formatowaniem.
wersja skryptu MyBB: 1.8.7
adres forum: http://cskomandosi.pl/index.php
na czym polega problem (screen, opis, komunikaty, nazwa stylu/theme/szablonu): styl myipb.

Otóż nie chciałem kupować pluginu na UM, więc postanowiłem pobawić się w css i html, nie umiem tego robić pięknie, dokładnie itp itd xD, dlatego proszę o pomoc Was.
Wchodząc na forum przez przeglądarkę na komputerze wszystko pięknie działa, ale jak wchodzę na komórce wszystko się "rozwala" i zasłania pół forum.

CSS:
Kod:
#uzytkownikm {
padding: 10px;
margin-bottom: 30px;
height: 90px;
}

#uzytkownikmL {
width: 138px;
clear: both;
float: left;
height: 90px;
padding: 20px;
text-align: center;
}

#uzytkownikmR {
float:left;
padding: 20px;
width: 760px;
font-size: 12px;
text-align: justify;
}

HTML
Kod:
        <table cellspacing="0" cellpadding="4" border="0" class="tborder">
                <thead>
                    <tr>
                        <td colspan="2" class="thead" style="font-weight:bold;text-align:left;">
                            Użytkownik Miesiąca <span style="float:right"><img src="https://i.imgur.com/EUjkyUD.png"/></span>
                            <div style="clear: both" />
                        </td>
                    </tr>
                </thead>
            </table>
                <div id="uzytkownikm" style="position: absolute; left: 50%; margin-right: -50%; transform: translate(-50%, -50%);">
                    <div id="uzytkownikmL" style="margin-top: 50px;">
                        <center><image src="http://cskomandosi.pl/images/myipb/default_avatar.png" style="max-height: 120px; max-width: 120px;" /></center><br />
                        <a href="http://cskomandosi.pl/user-131.html"><span class="to_na_gorze_i_dole_xd" style="background:#2e4861; margin-bottom: 5px;">Zobacz Profil</span></a><br />
                        <a href="http://cskomandosi.pl/private.php?action=send&uid=131"><span class="to_na_gorze_i_dole_xd" style="background:#2e4861">Wyślij PW</span></a>
                    </div>
                    <div id="uzytkownikmR" style="margin-top: 50px" border-left: 2px dotted #000;>
                        <br /><br />
                        <font size="5"><span style="text-shadow: 1px 1px 10px #99CCFF; color: #99CCFF; font-weight: bold"><b><a href="http://cskomandosi.pl/user-131.html"><font color="#99CCFF">ChiLLoUt</b></a></font></span></font><span style="float:right; margin-top: 10px"><font size="1.5px">Użytkownik Miesiąca <span class="prefiks" style="background:#2e4861";>Czerwiec - 2016</span></font></span>
                        <hr />
                        <font size="3">Gratulacje dla <b>ChiLLoUt</b>, naszego nowego <b>Użytkownika Miesiąca - czerwiec - 2016</b> Data rejestracji: <b>03-10-2016</b>, ale oczywiście każdy wie, że tak na prawde jest z nami już od paru dobrych lat. <br />
                        Użytkownik ten bardzo udziela się na forum, chce pomóc w rozwoju sieci i zasypuje nas swoimi propozycjami, bez powodu nie ma weterana sieci.</font>
                        <span style="border-top: 1px dashed white"></span>
                    </div></center>
                </div>
Proszę o pomoc i z góry dziękuję ;)
Zacznij od zmiany położeń elementów z px na procentowe, następnie poczytaj co to rwd