css - 将文本向右移动 [英] css - move text to right

问题描述

如果您创建< div> 并为边框设置样式（例如， border-radius：3px; ）文本几乎在边框的顶部，这看起来很不好。

我能找到的唯一解决方案是wrap该div的内容在另一个div，并向右移动包装div±3px。
这会创建一个额外的标记，它不知怎么感觉不对，如果有一个bettr解决方案。

这里是我的问题：

是否可以使用css-only将div的三个像素的内容向右移动？

当然，我想要一个跨浏览器的解决方案，但我不介意每个浏览器的css规则，我可以把它放在我的样式表的底部，从来不再看，这不会使复杂的标记。

解决方案

  padding-left：3px; 
  

将它添加到您的div中，其中包含文本。

有关填充的详情： http://www.w3schools.com/css/css_padding.asp

This is something that annoys me very often.
If you create a <div> and style the border (for example, border-radius: 3px;) the text is almost on top of the border, which looks very bad.
The only solution I could come up with was wrapping the contents of that div in another div, and move the wrapping div ±3px to the right. This creates a lot extra mark-up, and it somehow doesn't feel right, as if there is a bettr solution.

So here's my question:
Is it possible to move the contents of a div three pixels to the right as described above with css-only?

Of course I'd like a cross-browser solution, but I don't mind 1 css rule per browser, I can throw that somewhere at the bottom of my stylesheet and never look at it again, that won't complicate the markup.

解决方案

padding-left:3px;

Add that to your div which has the text in it.

Read more about padding: http://www.w3schools.com/css/css_padding.asp

这篇关于css - 将文本向右移动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！