我遇到了无法使左侧导航栏具有固定宽度的问题，同时不仅使顶部栏，而且使侧面导航栏具有粘性。
我尝试了所有的谷歌结果和我能找到的所有 stackoverflow 提示，但仍然没有运气。
我的 HTML：
<!-- Navigation bar -->
<div class="sticky">
<nav class="top-bar">
<ul class="title-area">
<!-- Title Area -->
<li class="name"><h1><a href="#"><img src="img/logo.png"> </a></h1></li>
<!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
<li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>
</ul>
<section class="top-bar-section">
<ul class="left"></ul>
<ul class="right">
<li class="has-form">
<form>
<div class="row collapse">
<div class="small-8 columns">
<input type="text" name="searchfield">
</div>
<div class="small-4 columns">
<a href="#" class="tiny button">Search</a>
</div>
</div>
</form>
</li>
</ul>
</nav>
</section>
</div>
<!-- Main content -->
<!-- Nav Sidebar -->
<div class="row">
<div class="large-2 columns">
<div class="ad">
<ul class="side-nav">
<li><a class="tnav" href="#">Nachrichten</a></li>
<li><a class="tnav" href="#">Kultur</a></li>
<li><a class="tnav" href="#">Wirtschaft</a></li>
<li><a class="tnav" href="#">Sport</a></li>
<li><a class="tnav" href="#">Wissenschaft</a></li>
<li><a class="tnav" href="#">Englisch</a></li>
<li><a class="tnav" href="#">Technologie</a></li>
</ul>
</div>
</div>
<!-- Start Tiles -->
<div id="tiles" class="large-10 columns"s></div>
</div>
我的代码在这里：http: //jsfiddle.net/TPbhD/2/
在此处查看预览：http: //jsfiddle.net/TPbhD/2/embedded/result/
想法模板：
