元素高度不同-6ren"> 元素高度不同-我必须垂直排列我的输入文本元素。并且所有人的高度都相同。我可以使用 height = "30px" 自定义高度的 css 类,它工作完美,但是当我在浏览器中放大或缩小时,高度会增加或减少。 我如何编写-6ren">
gpt4 book ai didi

html - 我的 <input type ="text"/> 元素高度不同

转载 作者:行者123 更新时间:2023-11-28 03:01:37 24 4
gpt4 key购买 nike

我必须垂直排列我的输入文本元素。并且所有人的高度都相同。我可以使用 height = "30px" 自定义高度的 css 类,它工作完美,但是当我在浏览器中放大或缩小时,高度会增加或减少。

我如何编写正确的 css 类以使其正常工作

01

好的,这是完整的html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Feedback System</title>


<script src="Jquery/jquery-1.8.3.js" type="text/javascript"></script>
<script src="Jquery/jquery-ui-1.9.2.custom.js" type="text/javascript"></script>

<link href="CSS/Header.css" rel="stylesheet" type="text/css" />
<link href="Jquery/smoothness/jquery-ui-1.9.2.custom.css" rel="stylesheet" type="text/css" />
<style type="text/css">

.textbox
{
font-weight:bold;
}
td
{
border:solid 1px #c1c1c1;
}
.style9
{
width: 500px;
border: 1px solid #00FFFF;
height: 442px;
}
.no
{
width:50px;
text-align:center;
}
.ques
{
width:250px;
}
.column
{
width:100px;
height:100%;
float:left;
border:none;
border-right:solid 1px gray;
overflow:hidden;
}
.ans_cell
{
width:94px;
}
input{
width:100%;
line-height:27.5px;
height:auto;
display:block;
text-align:center;
}
</style>

<script type="text/javascript">

</script>
</head>
<body>



<div id="tabbox"
style="top: 160px; left: 7px; position: absolute; height: 38px; width: 100%; text-align: center;"
class="style6">
Feedback Form</div>


<div style="top: 216px; left: 98px; position: absolute; border-radius:20px; border-bottom:solid 1px #33ccff; height: 61px; width: 86%; font-family: 'Times New Roman', Times, serif; color: #666666; font-size: medium; font-weight: bold; border-left-style: none; border-left-color: inherit; border-left-width: medium; border-right-style: none; border-right-color: inherit; border-right-width: medium; border-top-style: none; border-top-color: inherit; border-top-width: medium;">

<div style="top: 10px; float:left; left: 81px; position: absolute; height: 19px; width: 93%; font-family: 'Times New Roman', Times, serif; color: #666666; font-size: medium; font-weight: bold; margin-left: 40px;">
<div style="position:absolute; top: 0px; left: -79px; width: 467px; margin-left: 80px;">Name :
<span class="style7">Yadav Sagar Sampatrao</span></div>
<div style="position:absolute; top: 1px; left: 479px; width: 179px; right: 449px;">
Roll No : <span class="style7">4242</span></div>
<div style="position:absolute; top: 0px; left: 675px; width: 177px; right: 255px;">Class :
<span class="style7">B. E.</span></div>
<div style="position:absolute; top: -1px; left: 883px; width: 219px;">Deparment :
<span class="style7">CSE</span></div>
</div>

</div>

<div style="position:absolute; top: 314px; left: 126px; width: 1119px; height: 499px; border:solid 1px #c1c1c1;">

<table class="style9">
<tr id="sub_name">
<td class="no">
Sr. No.</td>
<td class="ques" style="text-align:right;">
subject</td>
</tr>
<tr id="teacher_name">
<td class="no">
&nbsp;</td>
<td class="ques">
Parmeters to be Evaluated / Name of Teacher</td>
</tr>
<tr id="Tr1">
<td class="no">
1</td>
<td class="ques">
Punctuality and Regularity</td>
</tr>
<tr id="Tr2">
<td class="no">
2&nbsp;</td>
<td class="ques">
Subject Knowledge and Preparation</td>
</tr>
<tr id="Tr3">
<td class="no">
3</td>
<td class="ques">
Clarity of Communication Skilll and Speed of Delivery</td>
</tr>
<tr id="Tr4">
<td class="no">
4</td>
<td class="ques">
Clarity of writing on Black Board</td>
</tr>
<tr id="Tr5">
<td class="no">
5</td>
<td class="ques">
Use of teaching aids (ex- PPT, OHP, Models, Charts)</td>
</tr>
<tr id="Tr6">
<td class="no">
6</td>
<td class="ques">
Timely completion of Syllabus</td>
</tr>
<tr id="Tr7">
<td class="no">
7</td>
<td class="ques">
Understanding and Interest Generated in Subject</td>
</tr>
<tr id="Tr8">
<td class="no">
8</td>
<td class="ques">
Efforts improving academic performance of Students</td>
</tr>
<tr id="Tr9">
<td class="no">
9</td>
<td class="ques">
Class Control and Discipline</td>
</tr>
<tr id="Tr10">
<td class="no">
10</td>
<td class="ques">
Availability Outside Classroom for Discussion</td>
</tr>
<tr id="Tr11">
<td class="no">
11</td>
<td class="ques">
The attitude of Teacher towards Student</td>
</tr>

</table>
<div id="ans_window" style="position:absolute; top: 0px; left: 501px; width: 616px; height: 441px; border:solid 1px #33ccff;">
<div class="column">
<input type="text" disabled="disabled" />
<input type="text" disabled='disabled'/>
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
<input type="text" />
</div>
<div class="column"></div>
</div>
</div>
</body>
</html>

最佳答案

如下更改输入元素的 CSS:

input{
width:100%;
line-height:27.5px;
height:auto;
display:block;
text-align:center;
}

关于html - 我的 &lt;input type ="text"/> 元素高度不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34494537/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com