Axel Richter: Cursor in Textfelder nicht sichtbar (FF)

Beitrag lesen

Hallo,

Ich habe eine Internetseite mit einem Formular. Leider verschwinden im Firefox die Cursor, was sehr unschön ist, denn der User weiß nicht, welches Feld gerade den Focus hat.

Ich habe das ganze jetzt schon mal so weit runterbrechen können, dass es an meinem CSS liegen muss.
Aber mir ist nicht ersichtlich warum.

Offensichtlich zeigt der FireFox den Teil des Cursors in absolut positionierten Input-Boxen nicht an, welcher über einer Box mit overflow:auto liegt, die _nicht_ containing block dieser Input-Box ist.

Noch kürzerer Testcase:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>Titel</title>  
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
<style type="text/css">  
html, body { margin:0; padding:0; }  
  
.boxTopLayer{  
        position:absolute;  
        top:0;  
        left:0;  
        margin:0; padding:0;  
}  
  
.boxTopLayer p { margin:0; padding:0; }  
  
.boxContent{  
        background-color:#EBEBEB;  
        margin:.75em;  
        overflow:auto;  
}  
</style>  
</head>  
<body>  
<form class="boxTopLayer" action="#" method="post">  
 <p><input></p>  
</form>  
<div class="boxContent">Test</div>  
</body>  
</html>  

Wozu wird das overflow:auto bei Dir benötigt? Kann man es durch ein overflow:hidden ersetzten?

Wenn nicht, kann das DIV.boxTopLayer nicht _innerhalb_ des .boxContent absolut positioniert werden? Das .boxContent müsste dazu position:relative; bekommen und somit der containing block für das .boxTopLayer werden. Dann könnte .boxContent weiterhin overflow:auto; haben.

viele Grüße

Axel