jsp소스 구조와 요소검사시 소스 구조가 틀려요.

Question

안녕하세요 웹초보입니다...웹앱에다가 디자인을 입히고있는중인데요...생각처럼안되서요...ㅜㅜ(문제점이 뭔지 파악이안되요)일단 테두리를 입히는게 목적입니다.

제목 :
분류 :
체크리스트 :	STEP.1(중복선택 불가/필수 선택) ...
작성자 :	...td>
작성시간 :
글내용 :	...
첨부이미지 :	...
첨부파일 목록 :

위에서 밑줄친 부분이 테두리를 입히는 부분인데요... 콘텐츠 시작전 테두리는 입혀졌습니다.근데 마무리 부분 테두리가 안입혀집니다..즉 ㅁ모양에서 반만 입혀집니다.문제가 뭔지 모르겠어요.페이지 요소검사하면 안입혀진 부분에 해당하는 코드가 이상한 위치로 이동되있어서 그런거같은데 왜그렇죠...?

만티 · Accepted Answer

전자정부 표준 프레임워크 가져 오셨네요... 가장 문제는 아래 버튼 부분입니다. Table Layout 으로 이미 진행된 상태라면 Table 형식을 따라야 하는데 뜬금 없이 tr 이 올 자리에 div를 끼워 넣었네요. 그래서 browser가 랜더링을 이상하게 한 것 같아요.일단 버튼을 구성하는 div 를 tr로 감싸는 방향으로 진행하면 정상 표시 될 것 같습니다. (아래 그림에 주석처리 해 뒀어요..) PS. 제가 상관할 바는 아니지만 화면 소스를 저렇게 나 몰라라 하는 회사는 빨리 치고 빠지시길 권해 드려요..

만티 · Answer

쌍팔년 테이블 레이아웃과 div 레이아웃의 하이브리드 이군요... 눈이 아파서 패스~정말 도움 받고 싶으면 browser 에서 표시되는 full html 과 css 를 포함해서 문의 해주세요.

whdckstngh · Answer

스마트 헤어케어에 오신걸 환영합니다.

회원관리
- 관리자 회원
- 일반 회원

게시판
- 상담 게시판
- FAQ 게시판

상담게시판 - 글조회

제목 :

ㅎㅎ

분류 :

기타

체크리스트 :

STEP.1(중복선택 불가/필수 선택)
샴푸 후 머리가 기름지다
환절기만 샴푸 후 건조하다
샴푸 후 항상 건조하다

STEP.2
모발이 푸석거리고 윤기가 없다
모발이 건조하다
펌 또는 염색을 주기적으로 한다

STEP.3(중복선택 불가/필수 선택)
최근에 머리카락이 많이 빠진다
머리카락이 가늘고 힘이 없다
두피 속이 훤히 보인다

STEP.4
어깨에 비듬이 떨어진다
두피가 가려워서 자주 긁는다

작성자 :

핳핳

작성시간 :

2015-08-17

글내용 :

첨부이미지 :

이미지파일목록

첨부파일 목록 :

답글작성

목록

whdckstngh · Answer

더 눈이 아프실거같은데..ㅋ 우선 올려볼께요...해결기미가 안보임니다 ㅜㅜ

아스키 · Answer

드림위버 툴 사용하시나요?

whdckstngh · Answer

아뇨

만티 · Answer

screen.css 도 올려 보세요..

whdckstngh · Answer

* { margin: 0; padding: 0; } html,body { height: 100%; } body { background: #fff; color: #393939; font-family: Arial; font-size: 0px; line-height: 0; } #page-top-outer { background: url(../images/shared/top_bg.jpg) top center repeat-x; border-bottom: 1px solid #7e7e7e; height: 92px; } #page-top { margin: 0 auto; max-width: 1260px; min-width: 850px; position: relative; } #logo { float: left; margin: 45px 0 0 15px; } #logo a { display: block; } #top-search { display: inline; float: right; position: relative; margin: 46px 20px 0 0; z-index: 20; } .top-search-inp { background: url(../images/shared/top_search_inp.gif) no-repeat; border: none; color: #fff; font-size: 12px; height: 23px; padding: 6px 6px 0 10px; width: 164px; } #content-outer { background: url(../images/shared/content_repeat.jpg) repeat-x; } #content { color: #333; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 18px; margin: 0 auto 0 auto; max-width: 1260px; min-width: 780px; padding: 35px 0px 0px 0px; } #content-inner { color: #333; font-family: Arial, Helvetica, sans-serif; font-size: 12px; line-height: 18px; margin: 0 auto 0px auto; padding: 25px 0 30px 0; } #content-table { font-size: 0px; line-height: 0px; } #content-table th.sized { height: 15px; width: 15px; padding: 0; margin: 0; font-size: 0px; line-height: 0px; } #content-table-inner { font-size: 12px; line-height: 12px; padding: 10px 0 20px 0; } #tbl-border-top { background: url(../images/shared/border_bit.jpg) top repeat-x; line-height: 0; font-size: 0px; height: 15px; } #tbl-border-bottom { background: url(../images/shared/border_bit.jpg) bottom repeat-x; line-height: 0; font-size: 0px; height: 15px; } #tbl-border-left { background: url(../images/shared/border_bit.jpg) left repeat-y; } #tbl-border-right { background: url(../images/shared/border_bit.jpg) right repeat-y; } #table-content { line-height: 16px; margin: 0 10px 10px 10px; min-height: 300px; } .topleft { background: url(../images/shared/corner_top_left.jpg) no-repeat; width: 15px; height: 15px; } .topright { background: url(../images/shared/corner_top_right.jpg) no-repeat; width: 15px; height: 15px; } .bottomleft { background: url(../images/shared/corner_bottom_left.jpg) no-repeat; width: 15px; height: 15px; } .bottomright { background: url(../images/shared/corner_bottom_right.jpg) no-repeat; width: 15px; height: 15px; } #page-heading { margin: 0 0 15px 20px; } h1 { color: #4b4b4b; font-family: Tahoma; font-size: 22px; line-height: 24px; font-weight: normal; } h2 { color: #393939; font-size: 16px; font-weight: bold; line-height: 20px; margin-bottom: 10px; } h3 { color: #92b22c; font-size: 14px; font-weight: bold; line-height: 18px; margin-bottom: 10px; } /* MESSAGES --------------------------------------------------------------- */ #message-yellow { margin-bottom: 5px; } .yellow-left { background: url(../images/table/message_yellow.gif) top left no-repeat; color: #e79300; font-family: Tahoma; font-weight: bold; padding: 0 0 0 20px; } .yellow-left a { color: #e79300; font-family: Tahoma; font-weight: normal; text-decoration: underline; } .yellow-right a { cursor: pointer; } .yellow-right { width: 55px; } #message-blue { margin-bottom: 5px; } .blue-left { background: url(../images/table/message_blue.gif) top left no-repeat; color: #2e74b2; font-family: Tahoma; font-weight: bold; padding: 0 0 0 20px; } .blue-left a { color: #2e74b2; font-family: Tahoma; font-weight: normal; text-decoration: underline; } .blue-right a { cursor: pointer; } .blue-right { width: 55px; } #message-red { margin-bottom: 5px; } .red-left { background: url(../images/table/message_red.gif) top left no-repeat; color: #ce2700; font-family: Tahoma; font-weight: bold; padding: 0 0 0 20px; } .red-left a { color: #ce2700; font-family: Tahoma; font-weight: normal; text-decoration: underline; } .red-right a { cursor: pointer; } .red-right { width: 55px; } #message-green { margin-bottom: 5px; } .green-left { background: url(../images/table/message_green.gif) top left no-repeat; color: #6da827; font-family: Tahoma; font-weight: bold; line-height: 12px; padding: 0 0 0 20px; } .green-left a { color: #6da827; font-family: Tahoma; font-weight: normal; text-decoration: underline; } .green-right a { cursor: pointer; } .green-right { width: 55px; } a.icon-1 { background: url(../images/table/table_icon_1.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 8px 0 0; width: 24px; } a:hover.icon-1 { background: url(../images/table/table_icon_1.gif) 0 -24px; } a.icon-2 { background: url(../images/table/table_icon_2.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 8px 0 0; width: 24px; } a:hover.icon-2 { background: url(../images/table/table_icon_2.gif) 0 -24px; } a.icon-3 { background: url(../images/table/table_icon_3.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 8px 0 0; width: 24px; } a:hover.icon-3 { background: url(../images/table/table_icon_3.gif) 0 -24px; } a.icon-4 { background: url(../images/table/table_icon_4.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 8px 0 0; width: 24px; } a:hover.icon-4 { background: url(../images/table/table_icon_4.gif) 0 -24px; } a.icon-5 { background: url(../images/table/table_icon_5.gif) no-repeat; display: block; float: left; height: 24px; width: 24px; } a:hover.icon-5 { background: url(../images/table/table_icon_5.gif) 0 -24px; } #tooltip { background-color: #8c8c8c; border: 1px solid #767676; color: #fff; font-family: Arial; font-size: 10px; font-weight: normal; opacity: 0.85; padding: 0 5px; position: absolute; text-align: left; z-index: 3000; } #tooltip h6,#tooltip div { font-family: Arial; font-size: 11px; line-height: 20px; margin: 0; } #product-table { margin-bottom: 20px; } #product-table td a { color: #393939; } #product-table td a:hover { text-decoration: underline; } #product-table th { height: 50px; text-align: left; } #product-table .minwidth-1 { min-width: 110px; } #product-table td { border: 1px solid #d2d2d2; padding: 10px 0 10px 10px; } #product-table tr.alternate-row { background: #ececec; } td.options-width { padding: 0 0 0 10px; width: 210px; } td.checkbox-width { } .table-header-check { background: url(../images/table/table_header_checkbox.jpg) no-repeat; border: none; min-width: 29px; padding: 0px 0 0 10px; width: 29px; } .table-header-options { background: url(../images/table/table_header_options.jpg) no-repeat; border: none; min-width: 221px; padding: 0px 0 0 0; width: 221px; } .table-header-repeat { background: url(../images/table/table_header_repeat.jpg) repeat-x; border: none; font-size: 0px; line-height: 0; padding: 0px 0 0 0; } .table-header-options a,.table-header-repeat a { color: #fff; font-family: Tahoma; font-size: 13px; font-weight: bold; line-height: 14px; margin: 0 0 0 10px; padding: 0 10px 0 0; } .table-header-options a:hover,.table-header-repeat a:hover { color: #94b52c } th.line-left { border-left: 1px solid #373737; } #product-table tr.activity-blue { background: #e3eceb; } #toggle-all { display: block; width: 17px; height: 17px; cursor: pointer; background: url(../images/shared/checkbox.gif) 0 -17px; } #toggle-all.toggle-checked { display: block; width: 17px; height: 17px; background: url(../images/shared/checkbox.gif) 0 0; } /* RELATED ACTIVIES BOX */ #related-activities { float: right; font-size: 0px; line-height: 0; width: 271px; } #related-act-top { font-size: 0px; line-height: 0; } #related-act-bottom { background: url(../images/forms/bg_related_act.gif) no-repeat bottom; font-size: 0px; line-height: 0; } #related-act-inner { font-size: 11px; line-height: 16px; margin: 0 auto 0px auto; padding: 10px 0 20px 0; width: 225px; } #related-act-inner .left { float: left; width: 30px; } #related-act-inner .right { float: left; width: 195px; padding: 2px 0 0 0; } #related-act-inner .right h5 { color: #393939; font-size: 12px; } ul.greyarrow { list-style-type: none; } ul.greyarrow li { background: url(../images/forms/icon_list_arrow.gif) no-repeat 0 5px; line-height: 18px; padding: 0 0 0 12px; } ul.greyarrow li a { color: #92b22c; font-weight: bold; } ul.greyarrow li a:hover { text-decoration: underline; } .lines-dotted-short { background: url(../images/forms/lines_dotted_short.gif) no-repeat 0px 14px; font-size: 0px; height: 28px; line-height: 0; } /* PAGING --------------------------------------------------------- */ #paging-table { float: right; margin: 0 4px 0 0; } .page-far-left { background: url(../images/table/paging_far_left.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 4px 0 0; width: 24px; } .page-left { background: url(../images/table/paging_far_left.gif) no-repeat; display: block; float: left; height: 24px; width: 24px; } .page-far-right { background: url(../images/table/paging_far_right.gif) no-repeat; display: block; float: left; height: 24px; margin: 0 4px 0 4px; width: 24px; } .page-right { background: url(../images/table/paging_far_right.gif) no-repeat; display: block; float: left; height: 24px; width: 24px; } #page-info { float: left; line-height: 16px; padding: 3px 12px 0 12px; } /* ACTIONS BOX ----------------------------------------------- */ #actions-box { float: left; margin: 0 0 0 10px; position: relative; } a.action-slider { background: url(../images/table/dropdown_actions.gif) no-repeat; display: block; height: 30px; width: 110px; } a.action-slider.activated { background: url(../images/table/dropdown_actions.gif) no-repeat 0 -30px; display: block; height: 30px; width: 110px; } #actions-box-slider { background: url(../images/table/actions_slider_bg.gif) bottom no-repeat; display: none; left: 0; padding-bottom: 1px; padding-top: 10px; position: absolute; top: 24px; width: 110px; } #actions-box-slider-inner { font-size: 0px; line-height: 0; margin: 0 auto; width: 108px; } a.action-edit,a.action-delete { color: #272727; display: block; font-weight: bold; height: 20px; margin: 0 auto; padding: 10px 0 5px 45px; width: 63px; } a:hover.action-edit { background: #949494 url(../images/table/action_edit.gif) no-repeat 14px 5px; color: #fff; } a.action-edit { background: #c7c7c7 url(../images/table/action_edit.gif) no-repeat 14px 5px; } a.action-delete { background: #c7c7c7 url(../images/table/action_delete.gif) no-repeat 14px 5px; } a:hover.action-delete { background: #949494 url(../images/table/action_delete.gif) no-repeat 14px 5px; color: #fff; } /* FORM ------------------------------------------------------- */ .form-submit { background: url(../images/forms/form_submit.gif) no-repeat; border: none; cursor: pointer; display: block; float: left; height: 30px; margin: 0 4px 0 0; padding: 0; text-indent: -3000px; width: 80px; } .form-reset { background: url(../images/forms/form_reset.gif) no-repeat; border: none; cursor: pointer; display: block; float: left; height: 30px; text-indent: -3000px; width: 80px; } #id-form { } .inp-form { background: url(../images/forms/form_inp.gif) no-repeat; border: none; color: #393939; height: 25px; padding: 6px 6px 0 6px; width: 186px; } .inp-form-error { background: url(../images/forms/form_inp_error.gif) no-repeat; border: none; color: #393939; height: 25px; padding: 6px 6px 0 6px; width: 187px; } .form-textarea { border: 2; color: #393939; font-family: Arial, Helvetica, sans-serif; font-size: 12px; height: 350px; resize:none; padding: 6px 6px 0 6px; width: 800px; border-radius: 6px; } #id-form td { padding: 0 0 10px 0; } #id-form td.noheight { padding: 0 0 0px 0; } #id-form th { line-height: 28px; min-width: 130px; padding: 0 0 10px 0; text-align: left; width: 130px; } .styledselect-day,.styledselect-month,.styledselect-year { border: 1px solid #acacac; margin-right: 3px; padding: 3px; width: 64px; } #step-holder { font-family: Tahoma; height: 39px; margin-bottom: 20px; } .step-no { float: left; height: 29px; width: 18px; font-size: 18px; line-height: 18px; padding: 10px 0 0 0; text-align: center; } .step-no-off { float: left; height: 29px; width: 18px; font-size: 18px; line-height: 18px; padding: 10px 0 0 0; text-align: center; color: #cbcbcb; } .step-dark-left { float: left; background: url(../images/forms/step_dark_left.gif) no-repeat; height: 27px; padding: 13px 15px 0 25px; font-size: 13px; color: #fff; font-weight: bold; } .step-dark-left a { font-size: 13px; color: #fff; font-weight: bold; } .step-dark-right { float: left; width: 12px; background: url(../images/forms/step_dark_right.gif) no-repeat; height: 39px; } .step-dark-round { float: left; width: 8px; height: 39px; background: url(../images/forms/step_dark_round.gif) no-repeat; } .step-light-left { float: left; height: 27px; padding: 13px 15px 0 25px; font-size: 13px; background: url(../images/forms/step_light_left.gif) no-repeat; height: 39px; color: #cbcbcb; font-weight: bold; } .step-light-left a { font-size: 13px; color: #cbcbcb; font-weight: bold; } .step-light-right { float: left; width: 12px; background: url(../images/forms/step_light_right.gif) no-repeat; height: 39px; } .step-light-round { float: left; width: 8px; height: 39px; background: url(../images/forms/step_light_round.gif) no-repeat; } .bubble-left { float: left; width: 10px; height: 29px; margin-left: 5px; background: url(../images/forms/bubble_left.gif) no-repeat; } .bubble-inner { float: left; padding: 7px 0px 0 2px; color: #2e74b2; line-height: 14px; font-size: 11px; height: 22px; background: url(../images/forms/bubble_inner.gif) repeat-x; } .bubble-right { float: left; width: 8px; height: 29px; background: url(../images/forms/bubble_right.gif) right no-repeat; } .error-left { float: left; width: 13px; height: 32px; margin-left: 5px; background: url(../images/forms/error_left.gif) no-repeat; } .error-inner { float: left; padding: 7px 10px 0 4px; color: #fff; line-height: 14px; height: 25px; background: url(../images/forms/error_right.gif) right no-repeat; } .file_1 { border: 1px solid #acacac; padding: 5px; } /* NAVIGATION ----------------------------------------------- */ #nav-holder { margin: 0 auto; max-width: 1260px; min-width: 780px; text-align: left; } .nav-outer-repeat { background: url(../images/shared/nav/repeat.jpg) repeat-x; height: 77px; } .nav-outer { margin: 0 auto; max-width: 1260px; min-width: 850px; } #nav-right { float: right; position: relative; width: 225px; z-index: 0; } #nav-right a { display: block; float: left; margin: 0px 0 0 0; } .account-content { background: #454545 url(../images/shared/nav/account_drop_bg.gif) no-repeat bottom; display: none; left: 5px; padding-bottom: 20px; position: absolute; top: 30px; width: 170px; } .account-drop-inner { font-size: 0px; line-height: 0px; margin: 20px auto 0 auto; width: 140px; } .showhide-account { cursor: pointer; display: block; float: left; margin: 10px 5px 0 5px; } .account-drop-inner a { color: #fff; font-size: 12px; font-weight: bold; line-height: 16px; margin: 0 0 0 0; padding: 0 0 0 0; } .account-drop-inner a:hover { color: #94b52c; } .acc-line { background: url(../images/shared/nav/account_line.gif) no-repeat 0 7px; font-size: 0px; height: 14px; line-height: 0px; margin-top: 0px; padding: 0; } a#logout { margin: 10px 0 0 5px; } a#acc-settings { background: url(../images/shared/nav/icon_acc_settings.gif) no-repeat 0 2px; padding: 0 0 0 20px; } a#acc-details { background: url(../images/shared/nav/icon_acc_personal.gif) no-repeat 0 2px; padding: 0 0 0 20px; } a#acc-project { background: url(../images/shared/nav/icon_acc_projects.gif) no-repeat 0 2px; padding: 0 0 0 20px; } a#acc-inbox { background: url(../images/shared/nav/icon_acc_inbox.gif) no-repeat 0 2px; padding: 0 0 0 20px; } a#acc-stats { background: url(../images/shared/nav/icon_acc_stats.gif) no-repeat 0 2px; padding: 0 0 0 20px; } /* &#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61; This copyright notice must be untouched at all times. The original version of this stylesheet and the associated (x)html is available at http://www.cssplay.co.uk/menus/pro_dropline.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the associated (x)html may be modified in any way to fit your requirements. &#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61;&#61; */ .nav { float: left; font-family: Tahoma; font-size: 13px; height: 38px; position: relative; width: 600px; min-width: 600px; z-index: 500; } .nav-divider { background: url(../images/shared/nav/divider.jpg) top no-repeat; float: left; height: 40px; width: 15px; } .nav .table { display: table; } .nav .select,.nav .current { display: table-cell; float: left; list-style: none; margin: 0 0px 0 0; padding: 0; white-space: nowrap; } .nav li { float: left; height: auto; margin: 0; padding: 0; } .nav .select a { background: url(../images/shared/nav/pro_line_0.gif); color: #fff; display: block; float: left; height: 37px; line-height: 35px; padding: 0 20px 0 20px; text-decoration: none; white-space: nowrap; } .nav .current a { background: url(../images/shared/nav/pro_line_1.gif); color: #fff; display: block; float: left; height: 37px; line-height: 35px; padding: 0 0 0 10px; text-decoration: none; white-space: nowrap; } .nav .current a b { background: url(../images/shared/nav/pro_line_1.gif) right top; display: block; padding: 0 20px 0 10px; } .nav .select a:hover,.nav .select li:hover a { background: url(../images/shared/nav/pro_line_1.gif); color: #fff; cursor: pointer; padding: 0 0 0 10px; } .nav .select a:hover b,.nav .select li:hover a b { background: url(../images/shared/nav/pro_line_1.gif) right top; cursor: pointer; display: block; float: left; padding: 0 20px 0 10px; } .nav .select_sub { display: none; margin: 0 0 0 10px; } /* IE6 only */ .nav table { border-collapse: collapse; font-size: 1em; height: 0; margin: -1px; width: 0; } .nav .sub { display: table; list-style: none; /* margin: 0 auto; */ padding: 0; } .nav .sub_active .current_sub a,.nav .sub_active a:hover { background: transparent; color: #fff; } .nav .select :hover .select_sub,.nav .current .show { background: url(../images/shared/nav/back_0.gif); display: block; left: 0; padding: 0; position: absolute; text-align: left; top: 37px; width: 750px; z-index: 100; } .nav .current .show { z-index: 10; } .nav .select :hover .sub li a,.nav .current .show .sub li a { background: transparent; border: 0; color: #fff; font-weight: bold; font-size: 13px; display: block; float: left; margin: 0; padding: 0 10px 0 10px; white-space: nowrap; } .nav .current .sub li.sub_show a { background: url(../images/shared/nav/menus/back_1.gif); color: #94b52c; cursor: default; } .nav .select :hover .sub li a:hover,.nav .current .sub li a:hover { background: url(../images/shared/nav/menus/back_1.gif); color: #94b52c; visibility: visible; } /* FOOTER -------------------------------------------------------------- */ #footer { height: 70px; margin: 80px auto 0px auto; padding: 0px 0 0 0; text-align: left; min-width: 780px; max-width: 1260px; } #footer-left { color: #818181; font-size: 11px; line-height: 11px; padding: 15px 0 15px 25px; margin: 0 20px; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; background: url(../images/shared/icon_idlogo.jpg) no-repeat 0 12px; } #footer-left a { color: #818181; text-decoration: none; } #footer-left a.selected,#footer-left a:hover { color: #000; text-decoration: none; } /* GENERAL --------------------------------------------------------*/ table { border-collapse: collapse; } .fr { float: right; } a { outline: none; text-decoration: none; } a:hover { } .clear { clear: both; font-size: 0px; height: 0; line-height: 0px; margin: 0px; padding: 0px; } img { border: 0; } p { margin: 0px; padding: 0px; } form { margin: 0; padding: 0; } .line { border-top: 1px solid #dcdada; font-size: 0px; height: 1px; line-height: 0px; margin: 20px 0; padding: 0; } .font11 { font-size: 11px; } /* STYLED SELECTBOXES style 1 --------------------------------- */ .styledselect { background: #2a2a2a; border: 1px solid #424242; color: #fff; width: 120px; padding: 5px; line-height: 14px; margin-right: 6px; font-size: 12px; } div.selectbox-wrapper { background-color: #2a2a2a; border: none; border-bottom: none; margin: 0px; margin-top: 0px; max-height: 200px; overflow: auto; padding: 0px; position: absolute; text-align: left; width: 400px; z-index: 10; } div.selectbox-wrapper ul { list-style-type: none; margin: 0px; padding: 0px; z-index: 10; } div.selectbox-wrapper ul li.selected { background-color: 575757; color: #fff; } div.selectbox-wrapper ul li.current { background-color: #575757; } div.selectbox-wrapper ul li { border-bottom: none; color: #fff; cursor: pointer; display: block; font-size: 12px; line-height: 12px; list-style-type: none; margin: 0; padding: 6px 2px 6px 10px; } .selectbox_styled { background: url(../images/shared/top_search_select.gif) left no-repeat; border: none; border-left: none; color: #fff; cursor: pointer; display: block; font-family: Arial; font-size: 12px; height: 20px; margin: 0px 0px 0px 0px; padding: 6px 0 0 6px; text-align: left; width: 105px; z-index: 10; } /* STYLED SELECTBOXES style 2 --------------------------------- */ div.selectbox-wrapper2 { background-color: #e3e3e3; border: none; border-bottom: none; margin: 0px; margin-top: 0px; max-height: 200px; overflow: auto; padding: 0px; position: absolute; text-align: left; width: 400px; } div.selectbox-wrapper2 ul { list-style-type: none; margin: 0px; padding: 0px; } div.selectbox-wrapper2 ul li.selected2 { background-color: #94b52c; color: #fff; } div.selectbox-wrapper2 ul li.current2 { background-color: #94b52c; color: #fff; } div.selectbox-wrapper2 ul li { border-bottom: none; color: #393939; cursor: pointer; display: block; font-size: 12px; line-height: 12px; list-style-type: none; margin: 0; padding: 6px 2px 6px 10px; } .styledselect_form_1 { background: url(../images/forms/form_select.gif) left no-repeat; border: none; border-left: none; color: #393939; cursor: pointer; display: block; font-family: Arial; font-size: 12px; height: 24px; margin: 0px 0px 0px 0px; padding: 7px 0 0 6px; text-align: left; width: 192px; } .styledselect_form_2 { background: url(../images/forms/form_select_small.gif) left no-repeat; border: none; border-left: none; color: #393939; cursor: pointer; display: block; font-family: Arial; font-size: 12px; height: 24px; margin: 0px 0px 0px 0px; padding: 7px 0 0 10px; text-align: left; width: 60px; } /* STYLED SELECTBOXES style 3 --------------------------------- */ div.selectbox-wrapper3 { background-color: #e3e3e3; border: none; border-bottom: none; margin: 0px; margin-top: 0px; max-height: 200px; overflow: auto; padding: 0px; position: absolute; text-align: left; width: 400px; } div.selectbox-wrapper3 ul { list-style-type: none; margin: 0px; padding: 0px; } div.selectbox-wrapper2 ul li.selected3 { background-color: #94b52c; color: #fff; } div.selectbox-wrapper2 ul li.current3 { background-color: #94b52c; color: #fff; } div.selectbox-wrapper3 ul li { border-bottom: none; color: #393939; cursor: pointer; display: block; font-size: 12px; line-height: 12px; list-style-type: none; margin: 0; padding: 6px 2px 6px 10px; } .styledselect_pages { background: url(../images/table/select_number_rows.gif) left no-repeat; border: none; border-left: none; color: #393939; cursor: pointer; display: block; font-family: Arial; font-size: 12px; height: 20px; line-height: 16px; margin: 0px 0px 0px 0px; padding: 4px 0 0 6px; text-align: left; width: 130px; } /* STYLED CHECKBOXES AND RADIOS -------------------------------------------- */ .ui-radio-state-disabled,.ui-radio-state-checked-disabled,.ui-radio-state-disabled-hover,.ui-radio-state-checked-disabled-hover { color: #999; } span.ui-checkbox,span.ui-radio { background: url(../images/shared/checkbox.gif) 0 -17px no-repeat; display: block; float: left; height: 17px; width: 17px; } span.ui-helper-hidden { display: none; } label { padding: 2px; } span.ui-radio-state-hover,span.ui-checkbox-state-hover { background-position: 0 0px; } span.ui-checkbox-state-checked { background-position: 0 0px; } span.ui-checkbox-state-checked-hover { background-position: 0 0px; } span.ui-radio-state-checked-disabled-hover,span.ui-radio-state-checked-disabled,span.ui-radio-state-checked { background-position: 0 -161px; } span.ui-radio-state-checked-hover { background-position: 0 -17px; } label { color: red; line-height: 20px; } .ui-helper-hidden-accessible { left: -999em; position: absolute; } /* LOGIN -------------------------------------------------------------------------------- */ #login-bg { background: url(../images/login/login_bg.jpg) no-repeat top center; } #login-holder { margin: 0px auto 0 auto; width: 508px; } #loginbox { background: url(../images/login/loginbox_bg.png) no-repeat; font-size: 12px; height: 212px; line-height: 12px; padding-top: 60px; position: relative; width: 508px; } #forgotbox { background: url(../images/login/loginbox_bg.png) no-repeat; display: none; font-size: 12px; height: 212px; line-height: 12px; padding-top: 60px; position: relative; width: 508px; } #login-inner { color: #161616; font-family: Tahoma; font-size: 13px; line-height: 12px; margin: 0 auto; width: 310px; } #login-inner label { color: #161616; cursor: pointer; font-family: Tahoma; font-weight: bold; line-height: 12px; padding-left: 10px; } .checkbox-size { width: 13px; height: 13px; margin: 5px 0; } #login-inner th { padding: 0 0 6px 0; text-align: left; width: 95px; } #login-inner td { padding: 0 0 6px 0; } .login-inp { background: url(../images/login/inp_login.gif) no-repeat; border: none; color: #fff; font-size: 16px; height: 28px; padding: 6px 6px 0 10px; width: 204px; } #logo-login { float: left; height: 35px; margin: 145px 0 0 15px; } a.forgot-pwd { bottom: 30px; color: #161616; font-family: Tahoma; font-size: 11px; font-weight: bold; line-height: 12px; position: absolute; right: 40px; } a:hover.forgot-pwd { color: #fff; } #forgotbox-text { color: #161616; font-family: Tahoma; font-size: 13px; font-weight: bold; line-height: 12px; margin: 0 auto 40px auto; width: 380px; } #forgot-inner { color: #161616; font-family: Tahoma; font-size: 13px; line-height: 12px; margin: 0 auto; width: 330px; } #forgot-inner label { color: #161616; cursor: pointer; font-family: Tahoma; font-weight: bold; line-height: 12px; padding-left: 10px; } #forgot-inner th { padding: 0 0 6px 0; text-align: left; width: 110px; } #forgot-inner td { padding: 0 0 6px 0; } a.back-login { background: url(../images/login/icon_back_login.gif) no-repeat 0 4px; bottom: 30px; color: #161616; font-family: Tahoma; font-size: 11px; font-weight: bold; line-height: 12px; padding: 0 0 0 10px; position: absolute; right: 40px; } a:hover.back-login { color: #fff; } .submit-login { background: url(../images/login/submit_login.gif) no-repeat; border: none; cursor: pointer; display: block; height: 29px; text-indent: -3000px; width: 73px; } .submit-login:hover { background: url(../images/login/submit_login.gif) no-repeat 0 -29px; }

whdckstngh · Answer

디자인 신경안쓰고 개발한 거에서 css,image,js,예제html주면서 입히라고 하는데..웹디자인은 해본적이 없어서 작은거 하나 입히는데도 생각처럼안되네요 ㅜㅜ

만티 · Answer

제 환경(Chrome) 에서 대충 맞춰보니 아래와 같은데...정확이 어떻게 되고 싶으신건가요? (물론 그림은 신경쓰지 마세요...)

whdckstngh · Answer

위의 실행화면 보시면 컨텐츠내용을 둘러쌓고있는 회색 네모가 있습니다(모서리는 둥근)이게 짤려서 나옵니다.. (오른쪽선과 하단 선과 모서리)

whdckstngh · Answer

감사합니다..ㅜㅜ우선 해결 됬네요 (왜저게 안보였는지 ㅜㅜ)사실 얼마전에 혼나기도 했습니다 ㅜㅜ 소스가 엉망이라고 ㅜㅜ(웹쪽은 학교다닐때도 안해봐서) 디자인을 입히라고 자료들을 받았을때 막막했는데 어떻게어떻게 하다보니 결과물은 나와서소스는 정리도 안하고 가는 경향이있었습니다 ㅜ 어쨋든 감사합니다 덕분에 결과는 잘나오네요 ㅜ

jsp소스 구조와 요소검사시 소스 구조가 틀려요.

13개의 답변

Q&A 목록