텍스트가 오른쪽 열의 맨 아래로 떨어집니다.

Question

누군가가 도울 수 있기를 바랍니다. _s 템플릿을 사용하여 WordPress 테마를 만들고 있는데 오른쪽 열에 문제가 있습니다.

단지 줄 바꿈을 넣으면 흐름이 정확합니다. 그러나 텍스트, img 또는 다른 것을 삽입하자 마자 해당 데이터가 가운데 열 아래로 떨어집니다.

나는 내가 볼 수없는 것이 단순하다는 것을 알고있다.

다음은 페이지에 대한 링크입니다. 여기

그리고 http://juststin.com/test/help.html 문제가 당신의 이상 열 레이아웃 인 CSS를

.content-area { 
     float: left; 
} 
.site-content { 
     margin: 0 20%; 
     width: 60%; 
     -moz-border-radius: 25px 25px; 
     border-radius: 25px 25px; 
     border-width: 5px; 
     border-style: solid; 
     border-color: #333333; 
     background: #ffffff; 
} 
.pictures { 
     margin: 0 81%; 
     width: 20%; 
     -moz-border-radius: 25px 25px; 
     border-radius: 25px 25px; 
     border-width: 2px; 
     border-style: solid; 
     border-color: #ffffff; 
     background: #ffffff; 
} 
.site-main .widget-area { 
     float: left; 
     margin: 0 0 0 -100%; 
     width: 20%; 
     background: #2E9AFE; 
     background: #333333; 
} 
.site-footer { 
     clear: both; 
     width: 100%; 
     background: #ffffff; 
     -moz-border-radius: 25px 25px; 
     border-radius: 25px 25px; 
     border-width: 5px; 
     border-style: solid; 
     border-color: #333333; 
} 
.site-header { 
     clear: both; 
     width: 100%; 
     background: #ffffff; 
     -moz-border-radius: 25px 25px; 
     border-radius: 25px 25px; 
     border-width: 5px; 
     border-style: solid; 
     border-color: #333333; 
} 

.menu-div { 
     border-width: 2px; 
     border-style: solid; 
     border-color: #ffffff; 
     background-color: #ffffff; 
     -moz-border-radius: 25px 25px; 
     border-radius: 25px 25px; 
     overflow: visible; 
} 

#page { 
     width: 90%; 
     margin: 0 auto; 
} 

Answer 1

입니다. 귀하의 #primary 열 앞에 렌더링하는 것이 아니라 .widget-area에 margin-left -100%을 제공하십시오. #pictures 열이 부동이므로 #primary 컨테이너 인 width이 100 % 인 후에 해당 열이 흐릅니다.

옵션 1) 열을 놓아야하며 음수 여백을 사용하지 마십시오.

옵션 2) 약 60 %처럼 보인다 (#primary에 고정 폭을 할당) 및 #pictures 떠 당신은 정말 열 레이아웃 마크 업에 약간의 변화가 필요뿐만 아니라

Answer 2

떠났다. 귀하의 마크 업을 편집하고 CSS를 조금씩 수정했습니다 (사용하지 않는 것이 좋습니다). 살펴보기 http://pastebin.com/raw.php?i=hqi0MLTc

오프 주제 : 개인적으로 콘텐츠 영역에만 사이드 바/오른쪽 왼쪽 열 및 유체 너비에 고정 폭을 사용하는 것이 좋습니다.

희망이 도움이됩니다.

Answer 3

문제는 결국 내가 오른쪽 사이드 바의 크기를 줄여야한다는 것이 었습니다. 국경을 추가하는 것이 크기를 100 % 이상으로 늘리고 있었다고 생각합니다.