Ajutor cu css mobile responsive

Shtrumphu

SEO Expert
Registered
Full Member
Freelancer
SEO Expert
Ma poate ajuta cineva cu CSS? incerc sa fac wrapper-ul sa aibe latimea maxima 500px, insa nu stiu exact ce media query sa pun, am incercat diferite variante dar nu vrea.

css.jpg
 
Pai nu iti ia din css. Ca si margin iti ia din alta parte 50px. Sj tu ai 0. Daca pui !important?
 
Multumesc! Am reusit pana la urma, mai avea un fisier CSS, a trebuit sa le iau pe rand. Daca mai are cineva tema Viper si vrea sa o faca adecvata pentru mobil, poate folosi codurile astea:
-in style.css
HTML:
@media screen and (max-width: 500px) {

    .wrapper {
        max-width: 500px;
        margin: 0px 0px;
        border: 0px;
    }
    .body {
        max-width: 500px;
        min-width: 499px;
        position: relative;
        overflow-x: hidden;
    }
    #primary {
        max-width: 450px;
    }
    #content {
        max-width: 450px;
    }
    #head {
        max-width: 500px;
    }
    #colophon {
        max-width: 500px;
    }
    #secondary {
        max-width: 450px;
        clear:left;
    }
    #container_12 {
        max-width: 500px;
    }
    #mobileresponsive {
        display: none;
    }
    #search {
        display: none;
    }
    #botmenu {
        width: 455px;
        background: #f03d0c;
        float: left;
    }
    .page {
        width: 455px;
        background: #f03d0c;
    }
    .html {
        overflow-x: hidden;
    }


}
-in folderul css, fisier 960.css
HTML:
@media screen and (max-width: 500px) {

    body {
        max-width: 500px;
        min-width: 499px;
    }
    .container_12 {
        max-width: 500px;
    }
    .grid_12{
        max-width: 500px;
    }
}
-in header.php, la <div class="searchbox" adaugati id="mobileresponsive"
 
width face overwrite la max-width. Un articol destul de bun pentru reguli de genul este acesta https://css-tricks.com/tale-width-max-width/
Pai din articol nu reiese asta. Uite un exemplu clar ca nu face overwrite. Div doi desi are width 500px, nu se face mai mare de 300 .
Cod:
<html>
    <head>
    <style>
        .divUnu {
            background-color: green;
            width: 320px;
            max-width: 500px;
        }

        .divDoi {
            background-color: red;
            width: 500px;
            max-width: 300px;
        }
    </style>
    </head>
    <div class="divUnu"> Div Unu
        <div class="divDoi">Div Doi</div>
    </div>

</html>
 
Div doi desi are width 500px, nu se face mai mare de 300
Da, pentru ca are inheritance, adica, divUnu are width:320 si nu poate sa il faca mai mare decat 'parent div'.
Dar pentru responsive daca vrei, creaza un alt div cu max-width: 500px si width: 100% ceea ce va face browserul va fi sa afiseze divul in maxim 500px, iar daca nu are spatiu destul atunci aplica procentajul, uite aici un exemplu: https://jsfiddle.net/obokar/uoqpd51q/ (schimba dimensiunea browserului si ai sa vezi rezultatele).
 
Da. dar nu inteleg de ce zici ca suprascrie. E max-witdth.. Adica poate fi mai mic.. dar nu mai mare...
 
Loading...
Back
Sus