Question

这是代码：


    
    <body>
    <ul style="margin: 0; padding: 0;">
       <li style="display: block; float: left; width: 33%; background: pink; margin: 0; padding: 0;">jajaadjad d</li>
       <li style="display: block; float: left; width: 47%; background: green; margin: 0; padding: 0;">jajaadjad d</li>
       <li style="display: block; float: left; width: 20%; background: black; margin: 0; padding: 0;">jajaadjad d</li>
    </ul>
    </body>

在手机上，右侧有空白区域！请告知如何解决它。

Answer 1

我没有Android设备方便测试，但我怀疑问题是body标签上的默认样式，请尝试将body标签替换为：

  <body style="margin: 0; padding: 0;">

Answer 2

试试这个。对每个li

使用内联块样式

<body style="margin: 0; padding: 0;">
    <ul style="margin: 0; padding: 0;">
       <li style="display: inline-block; float: left; width: 33%; background: pink; margin: 0; padding: 0;">jajaadjad d</li>
       <li style="display: inline-block; float: left; width: 47%; background: green; margin: 0; padding: 0;">jajaadjad d</li>
       <li style="display: inline-block; float: left; width: 20%; background: black; margin: 0; padding: 0;">jajaadjad d</li>
    </ul>
    </body>

Answer 3

尝试：身体{
overflow-x：hidden！important; }

错误：在移动设备上有空白区右侧??? [bootstrap3]

3 个答案: