2017-09-04 4 views
-2

L'image est très à droite et le pied de page passe au-dessus du texte. Cela se produit lorsque je vois le site sur un appareil mobile. Que puis-je faire pour que ce soit juste? Voici le site: www.ferskvaregrossisten.noL'image et le paragraphe ne s'affichent pas correctement sur le mobile

img{ 
     width:100%; 
     width:150px; 
     length:150px; 
     -webkit-transform:rotate(270deg); 
     -moz-transform: rotate(270deg); 
     -ms-transform: rotate(270deg); 
     -o-transform: rotate(270deg); 
     transform: rotate(270deg); 
     position:absolute; 
     left:690px; 
     top:320px; 
    } 

    footer { 
    position: absolute; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    padding: 1rem; 
    background-color: #efefef; 
    text-align: center; 
    width:100%; 
    } 

    p{ 
     height: 40%; 
    width: 100%; 
    display: flex; 
    position: fixed; 
    align-items: center; 
    justify-content: center; 
    font-size: 18px; 
    width:100%; 
    } 

Répondre

0

Vous avez placé l'élément img absolument. Vous souhaitez utiliser le positionnement normal (la valeur par défaut est statique) et centrer l'élément avec

img{ 
    display:block; 
    margin: 0 auto; 
    // I added the following rules to constrain the size of the image 
    max-width: 300px; 
    height: auto; 
} 

Voici un codepen. https://codepen.io/NeilWkz/pen/XaQNEN