묻고답하기
css class명이 중첩되는 경우
2012.02.18 21:24
위와같은 기술대로 고쳐야하는대 이해가안가네요....
아래는 xe 최근글 위젯 스킨입니다. 아래의 예로 중첩을 피할려면 어떻게 해야할까요
.documentWrap { position:relative; width:100%; overflow:hidden; }
.documentWrap .items { margin:0; padding:0; overflow:hidden;}
.documentWrap .items li { background:url(../bull.gif) left center no-repeat; font-size:.9em; display:block; color:#666; margin-right:.1em; font:normal 10px tahoma, arial, sans-serif; overflow:hidden; white-space:nowrap; list-style:none; width:100%; padding:5px 0 5px 20px;}
.documentWrap .items li em.date { padding-bottom:2px; font:normal 10px tahoma, arial, sans-serif; color:#EF8D00;}
.documentWrap .items li span.comment a { font-weight:bold; color:#EF8D00; font-size:10px;}
.documentWrap .items li a { color:#666; line-height:1.5em; text-decoration:none; font:normal 11px arial, 돋움, sans-serif; text-decoration:none; }
.documentWrap .items li a:hover { text-decoration:underline;}
.orange .items li em.date { color:#EF8D00; }
.orange .items li span.comment a { color:#EF8D00; }
.blue .items li em.date { color:#458acb; }
.blue .items li span.comment a { color:#458acb; }
.green .items li em.date { color:#6db53e; }
.green .items li span.comment a { color:#6db53e; }
.gray .items li em.date { color:#999; }
.gray .items li span.comment a { color:#999; }
.purple .items li em.date { color:#da50c2; }
.purple .items li span.comment a { color:#da50c2; }
<!--%import("css/normal.css")-->
<div class="documentWrap {$colorset}">
<ul class="items">
<!--@foreach($widget_info->document_list as $oDocument)-->
<li>
<!--@if($widget_info->display_regdate == 'Y')-->
<em class="date">{$oDocument->getRegdate("m-d")}</em>
<!--@end-->
<a href="{$oDocument->getPermanentUrl()}#{$oDocument->getCommentCount()}">{$oDocument->getTitle($widget_info->subject_cut_size)}</a>
<!--@if($oDocument->getCommentCount())-->
- <span class="comment"><a href="{$oDocument->getPermanentUrl()}#comment">{$oDocument->getCommentCount()}</a></span>
<!--@end-->
<!--{$oDocument->printExtraImages($widget_info->duration_new)}-->
</li>
<!--@end-->
</ul>
</div>