2010-04-11 5 views
0

내가 디자인하고있는 페이지에는 텍스트 형식의 입력이 하나있는 양식이 있습니다. 일반적으로이 양식과 입력은 Chrome의 브라우저에서 제대로 렌더링되지만 가끔 왼쪽에 약 20 픽셀 렌더링됩니다. 페이지를 새로 고침하면 원래의 정확한 위치로 돌아갑니다.페이지를 새로 고칠 때 양식 입력이 때때로 움직이게됩니까?

저는 지금까지 크롬에서만 테스트했기 때문에 브라우저 간 문제는 아닙니다 (동일한 브라우저에서 발생합니다). 아래 코드에 문제가 있습니까?

여기 내 HTML 코드입니다 :

<!DOCTYPE htmls> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<link rel="stylesheet" href="style.css" type="text/css" /> 
<title>Test Site</title> 
</head> 
<body > 
<div id="supercontainer" class="style1"> 
    <img class="floater" src="top.jpg" alt="Top" /> 

     <img class="floater" src="left.jpg" alt="Left" /> 
     <div id="content"> 
      <p id="theText"> 
       Welcome. Please type a username. 
      </p> 

      <form id="prompt"> 
       <div><input type="text" name="promptLine" autocomplete="off" id="promptLine" onkeypress="return submitenter(event);" value="% " /></div> 
      </form> 
     </div> 
     <img class="floater" src="right.jpg" alt="Right" /> 

    <img class="floater" src="bottom.jpg" alt="Bottom" /> 
</div> 

여기 내 CSS 코드입니다 :

#supercontainer { 
margin: 0 auto; 
width: 900px; 

display: block; 
} 

img.floater { 
display: inline; 
float: left; 
} 

#content { 
background-color:black; 
display: inline; 
float: left; 

padding-left:5px; 
padding-right:5px; 
min-height:458px; 
max-height:458px; 
min-width: 803px; 
max-width: 803px; 

color: lime; 
} 

#theText { 
text-align:left; 
margin-bottom:0; 
margin-top:0; 

line-height: 0.3; 

font-family:"Courier New", Courier, monospace; 
} 

#prompt { 
position: fixed; 
top: 470px; 
} 

#promptLine { 
width: 100%; 
background-color: black; 

color: lime; 

border: none; 
outline:none; 
} 
+0

http://validator.w3.org 및 http://hsivonen.iki.fi/doctype을 확인하십시오. – BalusC

답변

1

이 몸과 HTML 태그를 닫으십시오? 또한, doctype "htmls"?

+0

HTML에 대한 doctype입니다. 나는 그 태그들을 닫았지만, 나는 그것을 위에서 복사하지 않았다. – samoz

+0

나는 "htmls"에 대해 들어 본 적이 없다. 진정한 오류와 '그냥 복사하지 못했습니다'의 차이를 어떻게 알 수 있습니까? – graphicdivine

관련 문제