2016-08-18 6 views
0

Я хотел оставить левую боковую панель и маржу оставаться на месте, пока кто-то прокручивает вниз . Но боковая панель сохраняет свою позицию here с изменением размера экрана. Какие-нибудь исправления?Css sidebar static

@media only screen and (max-width: 550px) { 
    .side-bar-icon { 
     display: none; 
    } 
    .side-line { 
     position: relative; 
     max-width: 36rem; 
     border-right: none; !important; 
     border-bottom: thick solid #ef4a60; 
     padding-bottom: 30px; 
     margin-bottom: 50px; 
    } 

Ссылка Код here

+0

Вот аналогичная проблема: http://stackoverflow.com/questions/15590803/how-to-implement-fixed-sidebar-correctly –

+1

Вопросы, ищущие код помощи должны включать короткий код, необходимый для воспроизведения это ** в самом вопросе ** предпочтительно в [** Stack Snippet **] (https://blog.stackoverflow.com/2014/09/introducing-runnable-javascript-css-and-html-code-snippets /). Хотя вы предоставили ссылку [** на пример или сайт **] (http://meta.stackoverflow.com/questions/254428/something-in-my-web-site-or-project-doesnt-work- can-i-just-paste-a-link-to-it), если ссылка должна стать недействительной, ваш вопрос не будет иметь ценности для других будущих пользователей SO с той же проблемой. –

+0

@Paulie_D благодарит за предложение. Я добавил код. –

ответ

1
@media (min-width: 550px) 
.eight.columns { 
    width: 65.3333333333%; 
    /* margin-left: 45%; comment this out*/ 
} 

.side-bar { 
    position: relative;/* change fixed to relative */ 
    top: 1; 
    left: 1; 
} 

Просто добавьте на, используя !important очень плохая практика, до и если очень-очень важно. Просто совет!

enter image description here

+0

Любые изменения в '.side-line'? должен ли @media выше этого https://github.com/abhigenie92/django-resumator/blob/temp_version/resumator/static/resumator/css/base.css#L15? –

+0

Пожалуйста, проверьте изменение в вопросе –

+0

@AbhishekBhatia .eight.columns находится под другим классом с именем 'eight columns content'! Теперь я вижу вашу сторону в правильном формате! не так ли? – Smit