Html 侧边栏链接不是';不可点击
我正在做一个网站与内容3盒 框1是我的标题,框2是侧边栏,框3是页面内容 看起来是这样的:Html 侧边栏链接不是';不可点击,html,css,wordpress,sidebar,webshop,Html,Css,Wordpress,Sidebar,Webshop,我正在做一个网站与内容3盒 框1是我的标题,框2是侧边栏,框3是页面内容 看起来是这样的: | HEADER ----|-------------------------- | S | PAGE CONTENT I | D | E | B | A | R | | 我现在得到的边栏代码是: 主页: <div style="z-index: 5; margin-left: 30.5% !important; width:
| HEADER
----|--------------------------
|
S | PAGE CONTENT
I |
D |
E |
B |
A |
R |
|
我现在得到的边栏代码是:
主页:
<div style="z-index: 5; margin-left: 30.5% !important; width: 780px !important; height: 215px;" id="carousel-example-generic" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
<li data-target="#carousel-example-generic" data-slide-to="1"></li>
<li data-target="#carousel-example-generic" data-slide-to="2"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner">
<div class="item active">
<img style="width: 780px; height: 215px;" src="#" alt="...">
<div class="carousel-caption">
<div class="carousel-caption"><p style="font-size: 20px; margin-left: -100%; margin-bottom: 40%;">Design is not for philosophy, it's for life.</p></div>
</div>
</div>
<div class="item">
<img style="width: 780px; height: 215px;" src="#" alt="...">
<div class="carousel-caption">
<p style="font-size: 20px;">Fashion is architecture: it is a matter of proportions.</p>
</div>
</div>
<div class="item">
<img style="width: 780px; height: 215px;" src="#" alt="...">
<div class="carousel-caption">
<p style="font-size: 20px; margin-left: -20%;">The details are not the details. They make the design.</p>
</div>
</div>
</div>
<!-- Controls -->
<a class="left carousel-control" href="#" class="carousel-example-generic" role="button" data-slide="prev">
<span class="glyphicon glyphicon-chevron-left"></span>
</a>
<a class="right carousel-control" href="#" class="carousel-example-generic" role="button" data-slide="next">
<span class="glyphicon glyphicon-chevron-right"></span>
</a>
</div> <!-- Carousel -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<!-- 4 blocks to sub pages -->
<div style="z-index: 5; width: 1024px; margin: 0 auto;">
<div style="float: left; margin-left: 20%;"><a href="huiden"><img style="padding: 10px; background: #C6A970; border: 1px solid #ffffff; width: 367; height: 245;" src="#" alt="" /></div>
</a>
<div style="float: right; margin-right: 40px;"><a href="geweien"><img style="padding: 10px; background: #C6A970; border: 1px solid #ffffff; width: 367; height: 245;" src="#" alt=""/></div>
</a>
<br />
<br />
<div style="float: left; margin-left: 20%;"><a href="wonen"><img style="margin-top: 40px; margin-bottom: 1%; background: #C6A970; padding: 10px; border: 1px solid #ffffff; width: 367; height: 245;" src="#" alt="" /></a></div>
<div style="float: right; margin-right: 40px;"><a href="accessoires"><img style="margin-top: 40px; margin-bottom: 1%; padding: 10px; background: #C6A970; border: 1px solid #ffffff; width: 367; height: 245;" src="#" alt="" /></div>
</a></div>
<br />
<br />
</div>
设计不是为了哲学,而是为了生活
时尚就是建筑:它是一个比例的问题
详细信息不是详细信息。他们设计的
但我的页面内容有以下CSS:
<div style="margin-left: 30% position: relative;">
我认为这是我的问题,我不能点击侧边栏中的链接
我做错了什么?或者我需要改变什么
提前谢谢 我通过添加以下内容修复了我的问题:
.sidebar {
position: absolute;
}
你确定不能单击吗?链接似乎可以点击。你是否期待一个“#”出现在该地点?JSFIDLE使用框架,因此您不会在浏览器位置看到#。请发布完整的示例,以便我们重现问题。您的JSFIDLE只包含侧边栏,这是有效的。而且,-10px对于填充底部无效。改为使用边距底部。你确定不会出现问题吗?现在一切正常,只有边栏有问题。