我的网站:emilyjane.ca
我的导航不会在我的水平滚动网站中正确跳转到这些部分,我无法弄清楚出了什么问题。每个部分都有一个大的div,里面包含所有元素。我已将导航与href“#”相关联,并将其链接到我的html中的ID以创建锚点。打印导航菜单链接根本没有移动到正确的位置。请帮忙!
CSS& HTML
#printsection {
width: 3700px;
height: 530px;
float: left;
margin-left:30px;
margin-top: 30px;
position: relative;
}
#title {
float: left;
margin-top: 100px;
margin-left:0px;
}
#page2silk {
width: 300px;
float: left;
clear: both;
margin-top:0px;
margin-left:200px;
position:absolute;
/*width: 300px;
float: left;
margin-top:0px;
margin-left: 300px;
position:absolute;*/
}
.silk {
float:left;
width:600px;
margin: 0px 0px 600px 150px;
overflow:hidden;
position:absolute;
}
<div class="navbar" id="nav">
<ul>
<li> <a href="#printsection">PRINT</a></li>
<li> <a href="#websection">DIGITAL</a></li>
<li> <a href="#illustrations">ILLUSTRATION</a></li>
<li> <a href="#photography"> PHOTOGRAPHY</a></li>
<li class="letstalk"> <a href="#letstalk"> LETS TALK</a></li>
<li> <a href="#https://www.instagram.com/emilyjane.design/" class="fa fa-instagram"></a></li>
</ul>
</div>
<div id="printsection">
<section id="title" >
<h4>
<span> PR</span>
<span> INT </span>
</h4>
</section>
<section id="page2silk" >
<h3>
Branding + Packaging
</h3>
<h1>
Silk Rebrand
</h1>
<h2>
A rebrand of the packaging and identity for Silk Almond Milk. It is packaged in a frosted glass bottle, which is eco-friendly by being 100% recyclable. The brand is stongly type based, using the typeface Acumin Pro.
</h2>
<section>
<img src="a3_ilse_website/Desktop_A3-assets/silk.png" alt="silk" class="silk"/> </section>
</section>
</div>