programing

오른쪽 다이내믹 콘텐츠를 포함한 100% 높이 좌측 사이드바 - 부트스트랩 + Wordpress

showcode 2023. 3. 21. 22:41
반응형

오른쪽 다이내믹 콘텐츠를 포함한 100% 높이 좌측 사이드바 - 부트스트랩 + Wordpress

부트스트랩과 워드프레스를 사용해서 웹사이트를 만들고 있어요.좌측 사이드바, 우측 컨텐츠의 2열 레이아웃입니다.올바른 컨텐츠는 동적이고 무한 스크롤 방식으로 확장됩니다.몇 가지 기술을 통해 좌측 사이드바를 100% 높이 설정하려고 했지만 소용이 없었습니다.

오른쪽 콘텐츠 div의 뷰포트 크기/높이에 따라 사이드바를 계속 내려갔으면 합니다.

저는 http://jsfiddle.net/ydPMr/3을 만들었습니다만, 제 개발 페이지(http://joshuawalker.koding.com)에서 제가 말하는 내용을 확인하시면 더 좋을 것 같습니다.

내 페이지의 기본 구조는 다음과 같습니다.

<div class="navbar navbar-inverse navbar-static-top">
<div class="navbar-inner"></div>
</div>
<div class="wire-unit hero-fix">
</div>
<div class="sidebar hidden-phone"></div>
<div class="content"></div>

사이드바를 풀 하이트로 만드는 방법을 알고 계신 분이 있으면 감사하겠습니다.

감사합니다!

난 잘 되고 있어.만지작거리다

설정했습니다.min-Height로.500px최소값을 원하지 않으면 제거합니다.그것은 에 따라 동작한다.height에 있는 콘텐츠의content div바이올린처럼

  <div class="wrapper">
    <div class="sidebar hidden-phone">
    </div>
    <div class="content">


    </div>
</div>

및 스타일

<style type="text/css" >
    .wrapper
    {
        min-height:100%;
        width:100%;
        position:relative;
        background-color:Black;
        display:inline-block;
    }
    .sidebar
    {
        width:20%;
        top:0px;
        left:0px;
        bottom:0px;
        position:absolute;
        background-color:Aqua;
    }
    .content
    {
        min-height:500px;
        width:80%;
        position:relative;
        background-color:Gray;
        float:right;
    }
</style>

언급URL : https://stackoverflow.com/questions/13909864/100-height-left-sidebar-with-dynamic-right-content-bootstrap-wordpress

반응형