중첩 된 하위 스타일 CSS가있는 정렬되지 않은 목록

WordPress 테마에서 작업하는 데 문제가 있습니다.중첩 된 하위 스타일 CSS가있는 정렬되지 않은 목록

CSS를 사용하여 아래 이미지와 같은 스타일을 지정하면 목록 항목 <li>comment stuff</li>에는 아바타 사용자 이미지, 댓글과 아바타를 연결하는 화살표 이미지, DIV가 포함 된 DIV가 포함되어 있음을 알 수 있습니다. 주석 그 자체.

내가 겪고있는 문제는 어린이 의견입니다. <ul class="child"><li></li></ul> 중첩 된 어린이 UL 목록은 INSIDE입니다. 내 의견은 주요 목록 항목입니다.

그래서 아래 이미지에서 댓글 목록이 어떻게 보이는지 알아 보겠습니다. 내가 자녀 댓글 주변에 그려진 빨간색 상자가 보이면 주 댓글 상자 안에 중첩 된 것을 볼 수 있습니다.

어떻게 든이 주 주석 상자 외부에있는이 하위 주석을 가져와 각 하위 주석이 자체 상자를 가질 수 있도록해야합니다.

자식 주석이 중첩 된 채로 남아 있기 때문에이를 수행하는 방법을 이해할 수 없으며 CSS 만 변경할 수 있습니다.

이상 적으로 나는 주 주석 바로 아래에 들여 쓰는 것을 제외하고는 주 주석과 똑같이 보이게하고 싶습니다.

어떻게이 일을 정말 도움을 사용할 수있는 아이디어가 있다면, 나는 Dabblet이 (단지 JSFiddle 좋아하지만 CSS에 대한 쿨러) 질문 http://dabblet.com/gist/1555382

enter image description here

출처

2012-01-03 CodeDevelopr

전체적으로 부모 주석의 스타일을 지정하지 말고,'div';로 둘러 쌉니다. 나는 워드 프레스 전문가는 아니지만 주석 템플릿을 변경할 수 있어야합니다 ... 드루팔 (Drupal에서 당신이 그것을 좋아하는 어떤 식 으로든 의견 템플릿을 정의 할 수 있습니다. – mreq

나는 당신이 코멘트를 어떻게 보이고 싶은지 혼란 스럽습니다. 분명히 해주세요. – b01

당신이 스레드 의견을 떠날 필요가 어떤 이유로, 당신은 목록 항목 대신 주석 상자를 스타일링으로 시작할 수있는 경우 : 당신에게 방법의 일부를 얻고,해야

.commentlist > li.comment { 
    position: relative; 
    width: 400px; 
} 

.c-body { 
    padding: 9px; 
    border-image: initial; 
    margin: 20px 0 30px 0; 
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); 
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); 
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); 
    -webkit-border-radius: 6px 6px 6px 6px; 
    -moz-border-radius: 6px 6px 6px 6px; 
    border-radius: 6px 6px 6px 6px; 
    background-color: white; 
}

거기에서 당신 당신이 좋아하는 것처럼 자녀의 스타일에 스타일을 붙일 수 있습니다.

출처

2012-01-03 15:58:01

의 코드 여기 페이지를 그냥 Wordpress에서 중첩 된 의견을 해제하십시오. 그것은 설정, 토론에있어, (중첩) 스레드

출처

2012-01-03 15:51:44

당신이 총알 포인트를 제거 할 수 있습니다 CSS를 사용하여 코멘트와 패딩이 바로 위의 메인 코멘트로 정렬 할 수 있습니다 사용 :

padding:none; 
list-style:none;

랩 리 DIV에 아이가 해설한다.

하지만 가장 좋은 방법은 아래에 나오는 Matt입니다.

출처

2012-01-03 15:53:43 Matt

중첩 된 하위 스타일 CSS가있는 정렬되지 않은 목록

답변

관련 문제