如何让inlineblock在safari上缩进

时间:2016-07-05 20:13:02

标签: html css safari

我试图在safari上的内联块中缩进文本。它只在铬中缩进。

我尝试过使用保证金。这适用于chrome,但在safari中我必须将margin-left调整为另一个数字,以使它们看起来相同。

我尝试了文本缩进,并且内联块现在没有正确包装。

HTML

        <nav>
    <ul>


      <li><a href="#" >Home</a></li>
      <li type="checkbox" class="sub">
        <input type="checkbox" />
        <a href="#" >Profile</a>


        <!-- Begin-->

             <ul class="submenu">
          <li >
            <a  target = "box">Profiles</a>

          </li>

        </ul>
      </li>


        <!-- end-->
      <li class="sub">
        <input type="checkbox" />
        <a href="#" >Logs</a>


        <!-- Begin-->

             <ul class="submenu">
             <li >
            <a   target = "box" >View Logs</a>

          </li>
          <li >
            <a   target = "box" >Testing a long test</a>

          </li>

        </ul>
      </li>

      </li>

    </ul>
  </nav>

Chrome中的CSS

 nav .submenu a {

 *zoom: 1;
 *display: inline;
  display: inline-block;
  max-width: 122px;
  margin-left: 55px;

  padding: 3px 1px 3px 0px;

}

Safari中的CSS

 nav .submenu a {

 *zoom: 1;
 *display: inline;
 display: inline-block;
 max-width: 122px;
  margin-left: 65px;

  padding: 3px 1px 3px 0px;

 }

我尝试对变量进行重要处理,看看有什么事情都覆盖了这些变量,并没有帮助他们看起来一样。

我也试过

text-indent:50px;

1 个答案:

答案 0 :(得分:1)

制作一张没有内容的表格,并将其放在文本之前。

<table>
    <tbody>
        <tr>
            <td width="65px"> <!--this is the indent, don't forget to style it so it becomes invisible.--></td>
        </tr>
    </tbody>
</table>