Question

图像向右移动，页脚覆盖文本。当我在移动设备上查看该站点时会发生这种情况。我该怎么做才能做到这一点？这是网站： www.ferskvaregrossisten.no

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%;
    }

Answer 1

你已经完全定位了img元素。您希望使用正常定位（默认为静态），并使用

将元素居中

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

这是一个codepen。 https://codepen.io/NeilWkz/pen/XaQNEN

图片和段落在移动设备上没有正确显示

1 个答案: