Question

元素的下一个位置

 
           * {
   box-sizing: border-box;
    }

 .container {
    width: 100%;
    font-size: 0;
    }
    
.container>div {
     display: inline-block;
     width: 50%;
     height: 100px;
     font-size: 1rem;
     bacground-color: #654fca;
     }

<div class='container'>
      <div class='item-left'>
      <div class='item-right'>
    </div>

所有浏览器一个接一个地将元素左侧和元素右侧水平定位。只有一个不错的浏览器Safari for Windows直立，将它们按到左侧。谁可以解释或告诉在Safari浏览器中计算宽度的内容，因为如果将元素的宽度减少到49％，元素将变为水平，但边缘剩余空间。

Answer 1

以这种方式更新您的CSS，您不必担心浏览器兼容性：

添加到您的CSS :(保留原始样式）

 .container>div.item-left {
    float:left;
  } 

 .container>div.item-right {
     float:right;
   }

Answer 2

如果您使用safari并想要找出宽度，首先必须在浏览器中启用开发人员工具栏。您必须打开safari首选项并单击高级选项卡。然后在窗格底部的菜单栏框中选择“显示开发菜单”。现在你可以关闭这个吧。现在，右键单击内容区域内的任意位置，然后选择“Inspect Element”。现在，新窗口应出现在浏览器的底部。当您将鼠标悬停在窗口的一部分时，代码将会出现。第一个数字是宽度。希望我能帮到你。

HTML，CSS，内联块Safari浏览器

2 个答案: