web-dev-qa-db-ja.com

非表示のHTML要素はスペースを取ります

Javascriptが後で埋めて変更する空の非表示要素（iframeはニース、段落はそうです）を作成したいと思います。これらの要素がスペースを占有しないようにする方法を理解できませんでした。余白とパディングをオフにして高さをゼロに設定しましたが、それでも空白になってしまいます。

ページ上にスペースをとらない隠し要素の例を見たいのですが。実は、HTML、CSS、Javascriptが欲しいです。 :-)。

javascripthtmlstylesheet
22
Mike D

visibility: hidden;を使用している場合は、代わりにdisplay: none;を使用する必要があります。

43
Jess

私はあなたが可視性を使用していると思います：隠されていますか？あなたが見てきたように、これはそれを隠しますが、それでもスペースを占有します。

ただし、display：noneを使用すると、非表示になり、ページレイアウトから削除されます。

4
James Hull

visibility: noneを使用すると、それらのオブジェクトに埋め込まれているターゲットが失われることがわかりました。その結果、私はfont-size: 0ptを設定しました。これは私にとってうまく機能しているようです。

私はこれを使用して、ReSTructuredテキストがインライン内部ターゲットに付けるデフォルトの名前を非表示にします。 span.target { font-size: 0pt };

1
awol

#myelement { display:none; }は、<div id="myelement"></div>を使用して、CSS経由ですでに実行しているはずです。

1
thedanielhanke

要素を非表示にするには、次を使用します。

document.getElementById(Id).style.display = "none";

要素を表示するには、次を使用します。

document.getElementById(Id).style.display = "inline-block";
0
Reddappa Naidu

最も一般的な解決策は、タイプが非表示の入力です。

<input type="hidden" value="yourvalue" id="yourid" />

スタイリングは必要ありません。

この入力の値は、次のようなもので設定できます。

document.getElementById('yourid').value="The Value Here";
0
Tim

Style = "display：none"またはstyle = "visibility：hidden"を設定し、不足しているコンテンツを完了した後に表示に設定できないのはなぜですか？

0
Palantir