CSS 레이아웃 좀 도와 주세요, 채택완료
나너우리
8년 전
조회 4,840
현재 그누보드에 COMPANY 테마를 이용해서 홈페이지를 만들려고 하고 있습니다.
이 테마의 레이아웃 부분을 아래와 같이 왼편에 게시판 설명을 하고 오른쪽에 해당 게시판의 최신 게시물이 올라오도록 하고 싶습니다.
아직 CSS 설정에 대한 것을 제대로 이해 하지 못하고 있어 이 부분에 대한 것을 생각대로 못 하고 있습니다. 수십번 수정을 해 봤는데 잘 안되네요. CSS에 대한 자료들을 찾아보고 연구해 보려고 해도 개념 자체가 제대로 안 서서 그런지 이해를 못 하겠습니다.
한번만 도와 주세요.
현재 기존의 default.css를 수정한 부분입니다.
</p><p>#main_bn li .bn_wr{width:1000px; margin:0 auto;padding-top:117px}</p><p>#main_bn li .bn_txt{background-color:rgba(39, 120, 197,0.8);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#902778c5,endColorstr=#902778c5);width:283px; height:205px;padding:25px;margin-top:100px}</p><p>#main_bn li .bn_txt h2{text-shadow: 0 1px 1px rgba(0, 0, 0, .3);color:#fff;font-size:2.667em;line-height:40px;margin-top:35px}</p><p>#main_bn li .bn_txt p{color:#fff;background:url(../img/bn_pbg.jpg) no-repeat top left;padding-top:20px;margin-top:20px ;font-size:1.34em;line-height:23px;}</p><p>#main_bn li .bn_board{position:absolute;background-color:rgba(220,220,250,0.4);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#902778c5,endColorstr=#902778c5);left:550px;width:400px; height:295px;padding:25px;margin-top:10px;}</p><div>기존 bn_wr의 top를 100px 올리고 bn_txt에서 마진을 100px 주었습니다. 그리고 새로 bn_board를 추가했구요.
실제 코드에 적용은 아래와 같이 했습니다.
</div><div><div><!-- 콘텐츠 시작 { --></div><div><div id="idx_wrapper"></div><div> <!--메인배너--></div><div> <div id="main_bn"></div><div> <ul class="bn_ul"></div><div> <li class="bn_bg1"></div><div> <div class="bn_wr"></div><div> <div class="bn_board"></div><div> <?php</div><div> echo latest('theme/basic', 'board', 5, 18);</div><div> ?></div><div> </div></div><div> <div class="bn_txt"></div><div> <h2>자유게시판</h2></div><div> <p>인사, 질문등 자유롭게 이용가능합니다.
광고, 스팸 혹은 불법적인 글은 통보 없이 삭제됩니다.</p></div><div> </div></div><div> </div></div><div> </li></div><div> <li class="bn_bg1"></div><div> <div class="bn_wr"></div><div> <div class="bn_txt"></div><div> <h2>a900.org
현재 수정 작업중</h2></div><div> <p>게시판 등은
사용 가능합니다</p></div><div> </div></div></div><div>원하는 디자인은 아래 게시판의 목록이나 최신글이 파란색 부분에 맞춰 지도록 하고 싶습니다.
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인