2017-10-01 2 views
0

Je dois centrer l'élément div pour les périphériques mobiles. Sur mon site Web: http://transporttest.cba.pl/ Sur la description des appareils mobiles div va à gauche.J'essaie d'utiliser des requêtes de médias, mais cela n'a pas fonctionné. Qu'est-ce que je fais mal? Sur PC, tout va bien. Ce fragment est de mon code:Comment centrer l'élément div dans les périphériques mobiles par les requêtes de média CSS

HTML: 
    <div id="opis"> 
     <h2> 
     <p style="line-height: 3cm; "> 
     &#9830; Od 1991 roku w branży. <br/> 
     &#9830; 9 zestawów (ciągnik+ naczepa firanka, colimulde). <br/> 
     &#9830; Uprawnienia ADR u każdego kierowcy.<br/> 
     &#9830; Warsztat obsługujący auta ciężarowe.<br/> 
     </p> 
    </div> 

CSS:

#opis 
{ 
    font-size: 25px; 
    font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif; 
    background-color: #F2F3F7; 
    height: auto; 
    width:72%; 
    display:inline-block; 
    text-align:center; 
} 
#container 
{ 
    text-align: center; 
    width:100%; 
} 

@media all and (max-width: 768px) { 
    #container{ 
     wiidth:100%; 
    } 
    #opis,#opis_onas,#opis_dok,#opis_praca,#oskup,#opis_warsztat,#okredyt 
    { 
     left:25%; 
     top:25%; 
     position:absolute; 
     width:50%; 
     text-align:center; 
    } 
    #menudol{ 
     text-align:center; 
     display: block; 
    margin: 0 auto; 
    } 
} 

@media all and (max-width:640px){ 
    #container{ 
     wiidth:100%; 
    } 
    #opis,#opis_onas,#opis_dok,#opis_praca,#oskup,#opis_warsztat,#okredyt 
    { 
     width:72%; 
     height:auto; 
     display:inline-block; 
     text-align:center; 
    margin: 0 auto; 
    } 
    #menudol{ 
     text-align:center; 
     display: block; 
    margin: 0 auto; 
    } 

} 

Répondre

0

Comme quelqu'un a fait remarquer déjà, assurez-vous corriger « wiidth » à « largeur », et vous pouvez essayer de définir une largeur sur la div que vous voulez centré, puis en ajoutant:

margin-left:auto; 
margin-right:auto; 

pour le centrer sur la page.