Olması gerekenden daha birkaç piksel daha düşük class="checkMax3"
görüntüler Aşağıdaki metin ile formu. Chrome, küçük harf "p" ve "q" gibi harfler alanın alt altında uzanır. IE 8, bu aynı harf alt kısmı görüntülenmez.
Eğer doğru hatırlıyorsam ben alanına aşağıdaki Javascript uygulanmış sonra, bu sorun başladı.
"Q" ve "p" gibi harfler alana tamamen sığabilecek kadar bunu yapmak nasıl herhangi bir fikir? Alan harf içeren yeterince yüksek görünüyor, ama metin alanında çok düşük yaklaşık 5 piksel olarak görünür.
Teşekkür peşin,
John
Javascript:
<script language="javascript" type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready( function () {
setMaxLength();
$("input.checkMax3").bind("click mouseover keyup change", function(){checkMaxLength(this.id); } )
});
function setMaxLength() {
$("input.checkMax3").each(function(i){
intMax = $(this).attr("maxlength");
$(this).after("<div class='commchar2'><span id='"+this.id+"Counter'>"+intMax+"</span> characters remaining</div>");
});
}
function checkMaxLength(strID){
intCount = $("#"+strID).val().length;
intMax = $("#"+strID).attr("maxlength");
strID = "#"+strID+"Counter";
$(strID).text(parseInt(intMax) - parseInt(intCount));
if (intCount < (intMax * .8)) {$(strID).css("color", "#006600"); } //good
if (intCount > (intMax * .8)) { $(strID).css("color", "#FF9933"); } //warning at 80%
if (intCount > (intMax)) { $(strID).text(0).css("color", "#990000"); } //over
}
</script>
PHP / HTML:
echo '<form action="http://www...com/.../submit2a.php" method="post">
<input type="hidden" value="'.$_SESSION['loginid'].'" name="uid">
<div class="submissiontitle"><label for="title">Story Title:</label></div>
<div class="submissionfield"><input class="checkMax3" name="title" type="title" id="title" maxlength="80"></div>
<div class="urltitle"><label for="url">Link:</label></div>
<div class="urlfield"><input name="url" type="text" id="url" maxlength="500"></div>
<div class="submissionbutton"><input name="submit" type="submit" value="Submit"></div>
</form>
';
CSS:
.submissionfield
{
position:absolute;
width:550px;
left:30px;
top:230px;
text-align: left;
vertical-align:text-top;
margin-bottom:10px;
padding:2px;
font-family: "Times New Roman", Times, serif;
font-size: 22px;
line-height: 30px;
color:#000000;
}