用CSS更改对象位置
用CSS更改对象位置
提问于 2013-11-24 10:59:37
我试图使用一个只使用密码的登录系统，它可以在这个url：http://tinyurl.com/qamzr9k上查看。
我抓取并使用CSS (从CSS站点)样式和位置登录框和提交按钮。
然而，有一个巨大的灰色丑陋的条形横过屏幕，就在登录框。
我想从那里移动丑陋的标题框，因为我想将其他内容放在登录表单之上。
但是，尽管我的努力和我对CSS代码所做的混乱改变，这个框不会移动。
我还注意到，该框中适合显示错误所需的消息字段。(请在密码字段中键入任何内容并提交以查看我在说什么)。因此，我想知道移动灰色框是否意味着移动所需的消息显示。
整个CSS等都太长了，无法在这里列出。因此，请访问：http://tinyurl.com/qamzr9k，然后查看源代码。
我认为灰色框是与页面正文中的以下片段(我改名为div)识别的；
<div class="topbar" style="width:500px; top: 209px; margin-left:auto; margin-right:auto; text-align:center"></div>谢谢大家
回答 2
Stack Overflow用户
回答已采纳
发布于 2013-11-24 11:41:00
如果您将html重组为以下内容。通过在即将到来的div中包含表单，它应该将该div中的所有窗体包装起来.包括顶级酒吧。
<div class="coming-soon">
<form method="post">
<span>Incorrect code.</span>
<input type="password" name="access_password"><input type="submit" name="Submit" value="Submit">
</form>
</div>我看不出
<div class="topbar" ...所以也许会把它去掉
然后，您可以将表单的样式设置为需要保持它相对于即将到来的div，并且始终将错误消息附加在表单中。
Stack Overflow用户
发布于 2013-11-24 11:08:07
试试这个：
form {
animation: 1.5s ease 0s normal none 1 appear;
background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.3)) repeat scroll 0 0 rgba(0, 0, 0, 0);
border: 1px solid rgba(0, 0, 0, 0.3);
border-radius: 6px;
box-shadow: 0 1px 3px rgba(255, 255, 255, 0.4) inset, 0 1px 3px rgba(0, 0, 0, 0.45);
padding: 10px;
position: relative;
top: -54px;
}正如您在这里看到的，我已经添加了top，所以最初您的页面将隐藏错误框。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/20173737
复制相关文章
相似问题
腾讯云开发者
