2013-11-09 3 views
0
나는 AACC 웹 사이트를 재현하고있어

(페이지 here)과의 문제는 "상"을 발전 선도 ","국가 이니셔티브 "라는 제목의 중간에 열을 정렬하려고 몇 가지 문제로 실행하고있다 프로그램". CSShere으로 볼 수있는 내 소스 코드에서 클린턴 사진이있는 배너가 로그인 영역과 사이드 바 왼쪽으로 떠오르게 만들었습니다. 그러나 내가 명백하게 사용하면 무한한 : 첫 번째 열 (내 페이지의 하단에 표시됨)은 오른쪽의 세로 막대 아래에 있습니다. 이 문제를 해결하는 방법을 모르는 것이 아니라 코드의 잘못된 위치에 문제가 무엇이든지 명확한 속성을 넣는 것일 수도 있습니다. 이것에 대한 새로운 시각을 사용할 수 있습니다. 나는 당신의 HTML 구조 할 수있는 것은 절대적 요소를 배치하는 것을 볼 수 있습니다DIV 정렬 및 플로트

#banner {float: left; width: 730px;} 

#logbar { 
background-color: rgb(95, 193, 47); color:#FFFFFF; padding: 3px; margin-left: 740px; width: 240px; height: 130px;} 

#sidebar{margin-left: 740px; width: 240px; height: 700px; padding:1px; background-color: #66CC66; margin-top: 3px;} 

#col1{float:left; width:236; height;300px; background-color:rgb(204, 227, 251);} 
+0

모두는 당신이 우리 스크린 샷을 보여줄 수 .. 나에게 좋은 것 같다? 이 문제에 직면 해있는 브라우저는 - 브라우저 버전과 OS를 알려주십시오. –

+0

여기에 문제가 있습니다. http://s12.postimg.org/k024g05zx/mywork.jpg 다음과 같이 표시됩니다. http://s17.postimg.org/s8pdkilgv/original_site.jpg FF로 사용하고 있습니다. 또한 IE에서 시도했습니다. 브라우저 호환성이 문제라고 생각하지 마십시오. 또한 난 당신이 내 모든 작품은 위에있는 웹 페이지를 제공 JSFiddle 또는 CodePen : – TeamRival

+1

을 사용하고 있습니다,하지만 당신은 너무 (일을 모든 것을 볼 수 있습니다 far and source code) http://www.sinc.stonybrook.edu/stu/csclement/hw4/hw4.html AACC 용 웹 페이지를 다시 만들려고하기 때문에 모든 사람들이 혼란스러워 할 것입니다. – Terry

답변

0

유일한 방법 :

는 여기에 내가 문제가 해결 될 수 있다고 생각 CSS 코드입니다.

#col1 { 
    top: 420px;   /* Add this */ 
    position: absolute; /* And this */ 
    width: 236px; 
    background-color: rgb(204, 227, 251); 
} 

그러나 이것은 실제로 해킹입니다. HTML을 재구성해야합니다. AACC는 좋은 예가 아닙니다. 레이아웃을 위해 테이블을 사용합니다. stackoverflow가 더 나은 예를 위해 사이드 바를 만드는 방법을 살펴보십시오.

+0

도움을 주셔서 감사합니다. 그래, 특히 테이블을 설정하고 열과 행을 병합하면 Dreamweaver에서 쉽게 복제 할 수 있기 때문에 이것은 가장 힘든 HW입니다. 나는 절대적인 포지셔닝이 최후의 수단이라는 것을 알고 있지만,이 경우에는 최선의 행동이 될 것이라고 생각합니다. 다른 모든 것을 코드화하지 않으려면 시간이 많이 걸릴 것입니다. 다시 한 번 감사드립니다! – TeamRival