Html 文本周围的 CSS 框，设置框大小
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/32040635/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS box around text, set box size
提问by Shawn Sonnier
I want to create a boxed border around some text, specifically numbers. But I want the box to be the same size, no matter if its a single digit number or a triple digit number. I've tried a couple things, but every time the border just wraps the number. The number will be wrap with the tag.
我想在一些文本周围创建一个带框的边框，特别是数字。但我希望盒子的大小相同，无论是个位数还是三位数。我已经尝试了几件事，但每次边框都只包含数字。号码将被标签包裹。
strong{
border: 1px;
border-style: solid;
font-size:12px;
}
回答by evrim oku
you have to give a fixed width for that element
您必须为该元素提供固定宽度
strong {
display: inline-block;
width: 50px;
border: 1px solid #000;
text-align: center;
}
回答by Maximillian Laumeister
As said in the comments, wrap your text using a divof fixed width and style the div with a border. Here is a live example:
如评论中所述，使用div固定宽度的a 包裹文本并使用边框设置 div 样式。这是一个活生生的例子：
#theDiv {
width: 300px;
border: solid red 2px;
}<div id="theDiv">
Your Content
</div>回答by Zyberg
I suggest using <div>tag in this situation (remember that you can place a div inside of div!) as it would look neat and you could do it pretty neatly. However it is also possible to make such a thing with 'padding:x' on CSS style sheet, but I do not suggest this way as it would be less efficient than div.
When you write your divs surrounding those numbers, define a class for all of them. Let's say <div class="numberBoxes"></div>(between would be that number), then go to CSS stylesheet and write .numberBoxes { }inside of curly braces design that border (remember to put width and height of div! It won't show up, if you don't!)
我建议<div>在这种情况下使用标签（请记住，您可以在 div 内放置一个 div！），因为它看起来很整洁，而且您可以做得非常整洁。但是，也可以padding:x在 CSS 样式表上使用 ' '制作这样的东西，但我不建议这样做，因为它比 div 效率低。当您围绕这些数字编写 div 时，请为所有这些数字定义一个类。比方说<div class="numberBoxes"></div>（中间是那个数字），然后转到 CSS 样式表并.numberBoxes { }在花括号内写下该边框设计（记住输入 div 的宽度和高度！如果不显示，它不会显示！）
