정렬되지 않은 목록의 텍스트 정렬 맨 위로

다음은 내 코드입니다. 해당 이미지로 가기 위해 텍스트를 정렬하기 위해 인라인 스타일을 사용하고 있지만 인라인 CSS는 친절하게도 다음 코드를 수정할 수있는 방법을 알려줍니다. 텍스트가 해당 이미지와 함께 맨 위에 정렬됩니다.정렬되지 않은 목록의 텍스트 정렬 맨 위로

<ul style="font-size:17px;vertical-align:top; margin-top:0;"> 
<li style="list-style-image: url(images/check.png);">Text is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to top</li> 
<li style="list-style-image: url(images/check.png);">Text is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to topText is not aligning to top</li> 

</ul>

출처

2013-01-07 soft genic

당신은 당신의 목록 항목에 대한 이미지를 포함 할 수? – Malkus

@MikeB이 URL을 사용하십시오. http://img253.imageshack.us/img253/149/02yespw9.gif 이미지 용, div의 너비를 100px로 사용하십시오. –

문제는 귀하의 코드가 아닙니다.

일부 불필요한 마크 업을 제거 할 수도 있습니다.

두통의 원인이되는 이미지. 글 머리 기호가 텍스트와 정렬되도록 조절해야합니다.

나는 좀 더 땜질 나고, 이미지 크기입니다. 이미지 높이가 사용자가 원하는 크기보다 큰 경우

verticle-align 또한 항상 기대 한대로 작동하지는 않습니다. 왼쪽 센터와 같은 배경 IMG에 대한 Reference

출처

2013-01-07 15:46:33 Malkus

괜찮습니다. 설명하는 마이크 ..... –

링크 된 바이올린 링크가 깨졌습니다. 복원 할 수 있니? –

@Barnee 미안 해요. 나는 주변을 둘러 보았고 내가 참조한 바이올린을 찾을 수 없었습니다. 나는 참고서를 꺼내었지만, 묻는 질문과 관련하여 그것은 이미지 크기에 관한 문제였다. – Malkus

웹의 가장 일반적인 구성 요소 중 하나 인 미디어 블록을 만들려고합니다. CSS에서 가장 유명한 이름 중 하나 인 Nicole Sullivan은 미디어 블록의 성격과 훌륭한 표준 구현에 대해 이야기하는 훌륭한 글을 가지고 있습니다.

http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/

내가보기 엔 그녀의 구현을 사용하거나 어떻게하는지 그녀 배우고 읽는 중 하나를 권장합니다.

출처

2013-01-07 15:28:11 Nate

글쎄 이미저기서 들려오는 것이었지만 제가해야한다고 생각했습니다. 'ordered list'와 함께, 텍스트를 맨 위에 정렬 할 수 있습니까? –

미디어 블록을 목록 항목 안에 넣기 만하면됩니다. 이것이 미디어 블록 패턴의 강점 중 하나입니다. 필요한 모든 컨텍스트에 놓을 수 있습니다. THAT SAID : 예, 일반 목록 항목을 사용하여 텍스트를 맨 위에 정렬 할 수 있습니다. MikeB가 그렇게하는 방법을 보여준 것처럼 보입니다. – Nate

설정 위치는

출처

2013-01-07 15:51:10 allpnay

정렬되지 않은 목록의 텍스트 정렬 맨 위로

답변

관련 문제