Question

我非常惊讶，找不到任何解决方案，甚至远程似乎工作！我正在尝试制作位于右侧的垂直标签，内容将位于左侧。我正在使用基础4框架。在他们的文档中使用vertical-nav会生成选项卡，但我似乎无法将它们移动到右侧。任何想法都会受到极大的关注。我正在使用基础文档中提供的代码：http://foundation.zurb.com/docs/components/section.html。见垂直导航。

截图显示我正在尝试实现的目标：http://i47.tinypic.com/246nmnr.jpg

非常感谢您的帮助。

Answer 1

将内容和导航放在列中。请参阅下面的示例和see it in action here。您必须调整jsfiddle中“结果”区域的大小才能看到columns的效果。

<div class="row">
    <div class="small-12 large-9 columns">
        <p >This is your content area</p>
    </div>
    <div class="small-12 large-3 columns">
        <div class="section-container vertical-nav" data-section="vertical-nav" style="">
            <section class="section">
                <p class="title"><a href="#">Privacy Policy</a></p>                    
            </section>
            <section class="section">
                <p class="title"><a href="#">License agreement</a></p>                    
            </section>
            <section class="section">
                <p class="title"><a href="#">DMCA</a></p>                    
            </section>
            <section class="section">
                <p class="title"><a href="#">Proprietary Notices</a></p>                    
            </section>
            <section class="section">
                <p class="title"><a href="#">Trademarks</a></p>                    
            </section>           
        </div>
    </div>
</div>

使用基础4框架制作右对齐的垂直标签？

1 个答案: