Question

我有两个要在彼此下方对齐的文本字段。我在前面放置了一个间隔div，其宽度为2em，并使用了背景色，以便能够看到测试过程中间隔的大小。其中之一需要在前面放置一个label，我将它放在间隔符div内，因此带有和不带有label的文本字段在彼此前面仍将具有相同的空间

现在的问题是，它总是在label和文本字段之间添加一些空白，例如空白。没有label的文本字段不会这样做。

一旦我删除了间隔符div，空间就不存在了，但是没有它，我不知道如何使两个文本字段前面的空间保持匹配。我尝试将相同的style从间隔div插入label中，但随后重新出现空格。

我还尝试了各种方法来删除padding或margin都没有成功。我什至尝试在第二个文本字段的&nbsp前面添加div来添加空格，但随后该空格比label中的空格要大一些。

这是我在Chrome中打开源代码时生成的HTML。您将无法在这里看到多余的空间，这很令人沮丧，但它在我的网站上。

<div class="row">
    			<div class="col-md-12">
    				<div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"><label for="veranstaltungsnamea">a)</label></div>
    				<input type="text" name="veranstaltungsnamea" id="veranstaltungsnamea" value="k" 
    				onchange="veranstaltungteilprüfung('a')" placeholder="deutsch" style="width:90%; margin-left:6;" >
    			</div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"></div>
    				<input type="text" name="veranstaltungsnameengla" id="veranstaltungsnameengla" placeholder="englisch" value="l" 
    				style="width:90%;">
                </div>
    </div>

我的网站上的预览：

在我的PHP中，代码如下所示。

echo '
<div class="row">
            <div class="col-md-12">
                <div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"><label for="veranstaltungsname' . $id . '">'. $id . ')</label></div>
                <input type="text" name="veranstaltungsname' . $id . '" id="veranstaltungsname' . $id . '" value="';

        echo findValue('veranstaltungsname' . $id, $sheetData);

        echo '" 
                onchange="veranstaltungteilprüfung(\'' . $id . '\')" placeholder="deutsch" style="width:90%; margin-left:6;" >
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
                <div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"></div>
                <input type="text" name="veranstaltungsnameengl' . $id . '" id="veranstaltungsnameengl' . $id . '" placeholder="englisch" value="';

        echo findValue('veranstaltungsnameengl' . $id, $sheetData);

        echo '" 
                style="width:90%;">
            </div>
        </div>';

Answer 1

是的，firefox中存在问题，我更新了您的代码，现在可以正常工作了。问题是margin可以输入，使其margin:0可以输入结果。

<div class="row">
    			<div class="col-md-12">
    				<div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"><label for="veranstaltungsnamea">a)</label></div>
    				<input type="text" name="veranstaltungsnamea" id="veranstaltungsnamea" value="k" 
    				onchange="veranstaltungteilprüfung('a')" placeholder="deutsch" style="width:90%; margin:0px;" >
    			</div>
            </div>

            <div class="row">
                <div class="col-md-12">
                    <div style="width:2em; height: 1em;background-color:mediumvioletred; float:left;"></div>
    				<input type="text" name="veranstaltungsnameengla" id="veranstaltungsnameengla" placeholder="englisch" value="l" 
    				style="width:90%; margin:0px">
                </div>
    </div>

标签/分割后如何删除多余的空间

1 个答案: