gpt4 book ai didi

css - 我不明白为什么这个 CSS 不起作用

转载 作者:太空宇宙 更新时间:2023-11-04 16:28:35 25 4
gpt4 key购买 nike

thirtydot 编辑:(没有文档类型)

这是 pastebin 中的代码:http://pastebin.com/zwPTd8dd

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>My Layout</title>
<style type="text/css">
#wholepage{
background: #fff;
width: 960px;
margin: 0 auto;
}

#header{
width: 960px;
margin: auto 0;
}
#header ul{
border:1px solid #bbbbbb;
width:100%;
height:45px;
-moz-border-radius:8px;
-webkit-border-radius: 4px;
list-style: none;
}
#header ul li{
float: left;
margin: 3px;
}


#login-form{
position: relative;
margin-left: 750px;
margin-right: -20px;
border: 1px solid #4e4e4e;
}

#frontpage-content{
position: relative;
margin-right: 210px;
border: 1px solid #bbbbbb;

}


</style>
</head>

<body>
<div id="wholepage">
<div id="header">
<ul>
<li>Home</li>
<li>Profile</li>

<li>username
<input type="text"/>
</li>
<li>password
<input type="password" />
</li>
<li><input type="submit" value="login"/>
</ul>
</div>

<div id="login-form">
widget 1 : description of widget one here ...
</div>
<div id="login-form">
widget 2 : description of widget two here...
</div>

<div id="frontpage-content">
content here<br/>
content here<br/>
</div>

<p>Terms of use | Contact | About | Developers | Advertising | Services | Partners</p>

</div>
</body>
</html>

它正在下推“frontpage-content”div。很长一段时间以来,我一直在努力解决这个问题。我没有更多的想法。 :(

这个问题解决了。谢谢你们的帮助。

最佳答案

我假设从您如何设置边距来判断您希望 frontpage-content 位于登录表单小部件的右侧?

如果是,则您缺少“float”的 CSS 值。我会把你所有的侧边栏内容放在一个 div 中,id 像“left-sidebar”,然后制作它

#left-sidebar {
width: 200px;
float: left;
}

#frontpage-content{
position: relative;
width: 750px;
float: right;
border: 1px solid #bbbbbb;
}

#login-form{
position: relative;
width: 100%;
border: 1px solid #4e4e4e;
}

在您的源代码中,在#frontpage-content 之后,放置:

<div style="clear:both;"></div>

在你的页脚内容之前。

关于css - 我不明白为什么这个 CSS 不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5095015/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com