似乎无法控制 CSS 中的类标签答案

【问题标题】：Don't seem to have control over a class tag in css似乎无法控制 CSS 中的类标签
【发布时间】：2011-04-08 21:36:31
【问题描述】：

我有一个类声明为特定输入的错误捕获：

'<span class="catch">Error caught</span>';

我在标签末尾做了一些样式：

.catch{
    font-size: 20px;
    color: #ffffff;
    font-family: arial;
    margin: 150px 0px 0px 35px ;
}

边距属性只是占位符，但我试图将文本向下移动到此表单的底部，但只能控制 x 轴，不能控制 y 轴。有没有办法解决这个问题？这是我的表单代码：

#main{ 
    width: 375px; 
    height: 150px; 
    background: url(images/formheader.png) 0 0 no-repeat; 
    margin:200px auto; 
    z-index: 1;

}

如果我需要提供更多信息，还有额外的 css。

已编辑：

#main{ 
   width: 875px; 
   height: 350px; 
   background: url(images/form.png) 0 0 no-repeat; 
   margin:250px auto; 
   z-index: 1; 
 }

【问题讨论】：

标签： html css

【解决方案1】：

<span> 是内联元素，只有 x 轴边距适用于内联元素。将.catch 设置为display:block;

根据@Czechnology 评论，将<span> 更改为<div> 比采用内联元素并将其设置为阻塞更有意义。

【讨论】：

最好将<span> 更改为<div>，而不是将其设置为块元素。
我把它改成了：'
Caught
'；并添加： display:block 到新更改的 #catch{ } 标签，但它仍然停留在同一个地方......我做错了吗？
我完全同意，但我是在回答这个问题，而不是重新思考 @user699378 的发展方式。不过会更新答案。但现在我正在考虑，如果@user699378 正在开发多种屏幕尺寸并需要重排跨度，这可能是有意义的。
<div class="catch">Caught</div> 并且您可以在 CSS 中使用.catch{} 定位它。因为是<div>，已经是块级元素，所以不需要display:block;
hmmm 将其更改为 div 似乎仍然不允许控制 y 轴。

【解决方案2】：

不看 html 就很难确切地知道你想要做什么，但如果你想让 .catch 出现在 #main 的底部，你可以使用类似的东西：

.catch{
    position: absolute;
    bottom: 0;
}
#main{ 
    position: relative;
    padding-bottom: 100px;    /* example to avoid content of #main to be under .catch */
}

【讨论】：