텍스트를 위로 이동 하시겠습니까?

나는이 page을 가졌고 오른쪽 상단 검색을 보면 ... 이미지 검색을 중심으로 텍스트 검색을 이동해야하지만 텍스트 정렬은 텍스트 정렬을 사용합니다. 여기에 원하는 것은 여기 텍스트를 위로 이동 하시겠습니까?

#Search { 
background: url("/images/no-letters-search.png") no-repeat scroll 0 0 transparent; 
border: medium none; 
font-size: 15px; 
height: 37px; 
left: 31px; 
padding-left: 26px; 
position: relative; 
top: -3px; 
width: 175px; 
font-family: Helvetica, sans-serif; 
}

내 CSS를

입니다 것은 내 HTML

<form id="search_form" method="post" action="/mm5/merchant.mvc?"> 
<input type="text" name="Search" id="Search" tabindex="0" /> 
<input name="Screen" type="hidden" value="SRCH" /> 
</form>

출처

2011-04-05 Trace

어떤 브라우저를 사용 하시겠습니까? –

맥에서 파이어 폭스 4는 제 브라우저이지만 모두 그걸보고 있어요 – Trace

음이다, line-height:18px;을 시도 - 그것을 할 수있다.

출처

2011-04-05 21:11:07

그 일은 ... 파이어 버그에서 그랬어요. – Trace

그레이트, 파이어 폭스. 여기에서 크롬을 사용하면 줄 높이가 작동했습니다. –

위에서 언급 한 것처럼 한 줄 텍스트를 가운데에 맞춰야하는 입력란의 높이로 줄 높이를 설정해보십시오.

출처

2011-04-05 21:13:32 omabena

fiebug에서 아무것도 시도하지 않았습니다. – Trace

실제로 텍스트는 이미 입력 필드의 가운데에 맞춰져 있습니다. 문제는 입력 필드가 실제 이미지보다 높다는 것입니다. 시각적으로 볼 때 시각적으로는 보이게됩니다 (기술적으로는 이미 가운데 맞춤).

현재 입력 필드의 높이가 37 픽셀이지만 입력 필드가 테두리가있는 상자 모델 요소 (중간)이므로 실제로 상자의 높이가 약 41 픽셀입니다. 테두리를 없애거나 입력 필드의 크기를 34px 또는 33px로 줄여야합니다.

또는 "테두리 : 보통 없음"을 올바르게 다시 쓸 수 있습니다. "border : 0".

아무도 이해가되지 않는다면, 나는 CSS 박스 모델을 http://www.w3.org/TR/CSS21/box.html에 조금 공부하는 것이 좋습니다.

출처

2011-04-05 23:13:55

텍스트를 위로 이동 하시겠습니까?

답변

관련 문제