Html 按钮显示第二个边框（css）

我正试着做一个布局网格，但似乎做不好

• 当我尝试使用

  display:table cell垂直居中显示他的文本时，按钮显示了这个奇怪的第二个边框

• 理想情况下，按钮的最大宽度必须为300px，但这也不起作用。。。随着时间的推移，它继续增长

有人对如何实现这一目标有什么想法吗？

第一部分： 删除边界：

.ui-btn-inner {
    border-top: 0;
}

第二部分： 将按钮的显示更改为

内联块

（可能需要调整顶部和底部的填充）

第1部分： 删除边界：

.ui-btn-inner {
    border-top: 0;
}

第二部分： 将按钮的显示更改为

内联块

（可能需要调整顶部和底部的填充）

---

您提到按钮对宽度的响应不是您希望的那样

#text {
    display: table;
    vertical-align: middle;
    text-align:center;
    position: absolute;
    width: 100%;
    max-width:300px;
    left: 10%;
    right:10%;
    height: 100%;
    top: 0;
}

如果您只希望它是

300px

，无论其他大小，请设置

#text{
    width:100%;
    max-width:300px;
}

您的文本div实际上就是您看到的具有背景的文本div。
您的按钮完全按照您的要求执行，最大宽度为300px，但包含的div看起来像按钮的一部分，不确定为什么需要包含文本div，但我想这是有原因的

根据前面的答案和这段代码，它看起来像{in Chrome}

---

您提到按钮对宽度的响应与您希望的不同

#text {
    display: table;
    vertical-align: middle;
    text-align:center;
    position: absolute;
    width: 100%;
    max-width:300px;
    left: 10%;
    right:10%;
    height: 100%;
    top: 0;
}

如果您只希望它是

300px

，无论其他大小，请设置

#text{
    width:100%;
    max-width:300px;
}

您的文本div实际上就是您看到的具有背景的文本div。
您的按钮完全按照您的要求执行，最大宽度为300px，但包含的div看起来像按钮的一部分，不确定为什么需要包含文本div，但我想这是有原因的

根据前面的答案和这段代码，它看起来像{in Chrome}

---

---

小提琴似乎不起作用，javascript框中没有任何内容。显然是IE敌对。。。在Firefox中工作。我对铬不太清楚。打开调试工具（F12）并检查按钮。你会看到里面有一块有边框，还有一块有外边框。是的，我知道，按钮的作用是无关紧要的。问题是中间的灰色按钮（“点击我”）。（用Chrome测试）你想实现什么？从#文本中删除display:table小提琴似乎不起作用，javascript框中没有任何内容。显然是IE敌意。。。在Firefox中工作。我对铬不太清楚。打开调试工具（F12）并检查按钮。你会看到里面有一块有边框，还有一块有外边框。是的，我知道，按钮的作用是无关紧要的。问题是中间的灰色按钮（“点击我”）。（使用Chrome进行测试）您想要实现什么？从#文本中删除display:table第1部分工作得很好，谢谢！第2部分也可以，但这个按钮失去了100%的高度…我还必须删除

.ui btn inner{display:block}

，您可能还需要将其更改为

inline

。@binocopars true，这就是为什么我说要调整顶部和底部的填充bottom@jackJoe隐马尔可夫模型。。。似乎它只有在我使用px时才起作用（这并不理想，因为高度是%）。当我使用%时，按钮会变大…您应该能够为样式设置

max height

或

min height

，就像您使用

max width

第1部分所做的那样，非常有魅力，谢谢！第2部分也可以，但这个按钮失去了100%的高度…我还必须删除

.ui btn inner{display:block}

，您可能还需要将其更改为

inline

。@binocopars true，这就是为什么我说要调整顶部和底部的填充bottom@jackJoe隐马尔可夫模型。。。似乎它只有在我使用px时才起作用（这并不理想，因为高度是%）。当我使用%时，按钮变大…你应该能够为样式设置

max height

或

min height

，就像你使用

max width

时一样，让它工作到那里。。。如何使它再高100%？你应该能够设置一个<代码>最大高度< /代码>或一个<代码>最小高度>代码>，就像你用<代码>最大宽度< /代码>一样。（有很多div和隐藏跨距，你只需要看看长方体模型并意识到每件作品都有它的设置，你可能想在

.ui btn text

span上尝试一些边距。让它工作起来了，'直到那里…如何使它再次达到100%高？你应该能够设置

最大高度

或

最小高度类似于您使用的<>代码>最大宽度< /代码>的样式，但是，现在，我的文本不再在中间垂直了：（有很多div和隐藏span，您只需查看长方体模型并意识到每个部分都有其设置，您可能需要在
.ui btn text
span上尝试一些边距。