CSS向下移动

Question

任何人都可以告诉我这个小部件是怎么回事：http://davidbeckblog.com/notify/？相关的CSS大部分在style.css的底部。

基本上，该部件有3个部分。左边是按钮，中间是文本框，右边是进度指示器的位置。当我添加文本框和进度指示器时，所有内容都被推下。

Answer 1

这些是内联元素，垂直对齐是baseline默认情况下，我相信。将所有3个跨度的垂直对齐设置为top，然后看起来您需要在span.status上指定margin-top:-3px，并可能将1px的顶部边距应用于通知我跨度。

另外，你可以浮动所有3与结算元素。

Answer 2

这似乎修复：

.notify-me input, .notify-me span { 
    vertical-align: top; 
} 

.notify-me input { 
    margin-top: 0.4ex; 
} 

（尽量避免，固定像素边距/填充，如当用户改变字体大小，这些将更快地胸围。）