Question

buttons' spaces

<div class="buttons">
  <button id="btn-search" type="submit">Google Search</button>
  <button id="btn-lucky" type="submit">I'm Feeling Lucky</button>
</div>

.buttons {
  max-width: 290px;
  margin: auto;
}
#btn-search, #btn-lucky {
  height: 34px;
  padding: 0 16px;
  margin:0 4px;
  border: 1px solid #f2f2f2;
}

为什么会出现这些空格？
我使用Eric Meyer的重置。

Answer 1

您正在使用space(  )按钮。这是解决方案。

＆＃13;

.buttons {

  max-width: 290px;

  margin: auto;

}

#btn-search,

#btn-lucky {

  height: 34px;

  padding: 0 16px;

  margin: 0px;

  border: 1px solid transparent;

}

＆＃13;

<div class="buttons">
  <button id="btn-search" type="submit">Google Search</button><button id="btn-lucky" type="submit">I'm Feeling Lucky</button>
</div>

＆＃13;

Answer 2

尝试删除填充css。你的新代码看起来像

<style>
.buttons {
  max-width: 290px;
  margin: auto;
}
#btn-search, #btn-lucky {
  height: 34px;
  margin:0 4px;
  border: 1px solid #f2f2f2;
}

</style>
<div class="buttons">
  <button id="btn-search" type="submit">Google Search</button>
  <button id="btn-lucky" type="submit">I'm Feeling Lucky</button>
</div>

按钮中的空格是什么？

2 个答案: