gpt4 book ai didi

css - 彼此相邻/水平堆叠 div

转载 作者:太空宇宙 更新时间:2023-11-03 21:51:04 24 4
gpt4 key购买 nike

我的 div 没有堆叠在一起

我该怎么办?一个 div 在另一个下面。

我尝试了所有类型的定位,甚至是相对定位,但都不起作用。

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<meta name="author" content="Chaitanya Gupta">

<meta name="keywords" content="Fashion, Learning, Resources ">
<link href='http://fonts.googleapis.com/css?family=Luckiest+Guy&effect=3d-float' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Bad+Script&effect=3d-float' rel='stylesheet' type='text/css'>
<link rel="icon" type="image/png" href="favicon.ico">
<title>FLR</title>

CSS

 <style type="text/css">
hr
{
color:white;
border-width: 2px;
border:medium silver dashed;
}

a:link,a:visited
{
display:block;
color:white;
}

a:hover,a:active
{
background-color:#7C868E;
text-decoration: underline;
border-radius:8px
}

a
{
font-family: "Century Gothic";
font-variant:small-caps;
font-size: 20px;
}

#emboss
{
border-right: 4px solid #2b2b2b;
border-bottom: 4px solid #2b2b2b;
}

#subTopic
{
font-family: 'Luckiest Guy', cursive;
font-size:60px;
font-weight:lighter;;
font-variant:small-caps;
}

#content
{
color:white;
font-family: 'Bad Script', cursive;
font-size:20px;
}

div.menu
{
background-color:#4A5662;
float:left;
width:150px;
height:210px;
border-radius:8px;
margin-top:20px;
margin-left:5px;
text-align:center;
padding-top:10px;
padding-bottom:10px
}

div.content
{

float:right;



}


</style>

<script>

</script>
</head>

HTML

<body background="denim.jpg">


<img src="fas.jpg" style="float:right; height:80px; width:200px;">
<br>
<br>
<br>
<br>
<br>
<br>
<hr>

<div id="emboss" class="menu" >

<a href="" onclick="displayAbout()">About</a></span>
<br>
<a href="" >Careers</a>
<br>
<a href="">Clients</a>
<br>
<a href="">Blogs</a>
<br>
<a href="">Contact Us</a>
</div>

<div class="content" id="display">
<h1 id="subTopic" class="font-effect-3d-float">About</h1>

<p id="content">FASHION LEARNING RESOURCES (FLR) is a Gurgaon,
India based small company pioneering Fashion Education &
Training Technology(FETT) products, services, consulting and
delivery services in FETT for the fashion institutes,
industry bodies and government. FLR also offers E learning
& multimedia content in Fashion / apparel Domain.
FLR is started by founding alumni batch of NIFT.</p>
</div>

<!--<hr style="position:absolute; bottom:30px; width: 1200px">
<code style="color:white; position:absolute; bottom:10px">Copyright &copy 2013 Fashion Learning Resources. All rights reserved.</code>
-->

</body>

</html>

最佳答案

试试这个

div.content
{
margin:0 0 0 160px;
}

用一个特定宽度的菜单和内容包裹一个 div 可能也很有用,然后确保添加的菜单和内容以及边距和填充是那个宽度。

div.wrap { width 800px}
div.content {width:640px}

关于css - 彼此相邻/水平堆叠 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17363647/

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