Question

如何为#more提供保证金，以便在调整窗口大小时始终与#logo保持相同的距离？

在全屏查看此处的代码并调整窗口大小，您将看到1到2的距离发生变化。

感谢您的帮助。

＆＃13;

body {
  font-size: 5vw;
  font-family: Arial;
  letter-spacing: 1px;
}
#logo {
  top: 10px;
  left: 10px;
  position: fixed;
}
#more {
  top: 10px;
  left: 50px;
  position: fixed;
}

＆＃13;

<div id=logo>1</div>
<div id=more>23456789</div>

＆＃13;

Answer 1

您希望使用与字体大小相同的单位：vh。

2个重要的附注：

不要使用位置：如果你想真正做出回应，则修复
不要在css中使用id，不允许在html中重复使用这些。

body {
  font-size: 5vw;
  font-family: Arial;
  letter-spacing: 1px;
}
#logo {
  display:inline;
}
#more {
  display:inline;
  padding-left: 2vw;
}

<div id=logo>1</div>
<div id=more>23456789</div>

Answer 2

实际上我可以float:left同时使用div和它也可以。

body {
  font-size: 5vw;
  font-family: Arial;
  letter-spacing: 1px;
}
#logo,#more {
float:left;
}

<div id=logo>1</div>
<div id=more>23456789</div>

保持基于大众的恒定保证金

2 个答案: