blocks|key|529148|text|有几条评论。一旦你清理了它，它可能会帮助解决这个和其他未来令人头疼的问题：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|529149|删除内联样式并将其放入样式表中。|529150|第二个div在隐藏的div下做什么？在我看来，这是多余的，也是不必要的。去掉它。|529151|如果你是浮动元素，那么你需要在整个过程中清除它们。这可能就是为什么你会把东西放在错误的地方。|529152|你有没有在图片旁边显示:阻止p元素并给它一个宽度？否则它无论如何都不会浮起来。|529153|您的h1不应为大写。|529154|希望这几个建议能有所帮助。|529155|entityMap^0|0|0|0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|P|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|Q|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|S|8|@]|9|@]|A|$]]|$1|H|3|I|5|6|7|T|8|@]|9|@]|A|$]]|$1|J|3|K|5|6|7|U|8|@]|9|@]|A|$]]|$1|L|3|M|5|6|7|V|8|@]|9|@]|A|$]]|$1|N|3|-4|5|6|7|W|8|@]|9|@]|A|$]]]|O|$]]

A couple of comments. Once you clean this up it might help to resolve this and other future headaches:

Remove your inline styles and put them in a stylesheet.

What is that second div doing under the hidden div? It looks redundant and unnecessary to me. Remove it.

If you're floating elements then you'll need to clear them down the track. This could be why you have things floating in the wrong spots.

Have you display:block'ed the p element next to the image and given it a width? Otherwise it's not going to float anyway.

Your h1 should not be uppercase.

Hope those few suggestions help out a bit.

blocks|key|520338|text|尝试执行以下操作，将和<img>排列在一起：|type|unstyled|depth|inlineStyleRanges|offset|length|style|CODE|entityRanges|data|520339|<div>
++++<p+id="popupText"+style="float:+left">
++++<p+style="float:+right"><img+id="popupImage"+/>
</div>|code-block|syntax|javascript|520340|我删除了position:+relative，因为您提供的代码不需要它，还删除了display:+inline，因为内联div没有任何意义。|520341|entityMap^0|A|3|E|5|0|0|4|I|14|F|0^^$0|@$1|2|3|4|5|6|7|O|8|@$9|P|A|Q|B|C]|$9|R|A|S|B|C]]|D|@]|E|$]]|$1|F|3|G|5|H|7|T|8|@]|D|@]|E|$I|J]]|$1|K|3|L|5|6|7|U|8|@$9|V|A|W|B|C]|$9|X|A|Y|B|C]]|D|@]|E|$]]|$1|M|3|-4|5|6|7|Z|8|@]|D|@]|E|$]]]|N|$]]

Try this to get the <code>&lt;p&gt;</code> and <code>&lt;img&gt;</code> lined up:

<pre><code>&lt;div&gt;
 &lt;p id="popupText" style="float: left"&gt;&lt;/p&gt;
 &lt;p style="float: right"&gt;&lt;img id="popupImage" /&gt;&lt;/p&gt;
&lt;/div&gt;
</code></pre>

I removed the <code>position: relative</code> because it's not needed with the code you provided, and the <code>display: inline</code> because it doesn't make sense to make the div inline.

blocks|key|529167|text|你检查过父元素的宽度了吗？如果在父元素上设置的宽度太小，将没有足够的空间在同一行上呈现段落和图像。这可能会导致您的段落和图像呈现在不同的行上。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|529168|entityMap^0|0^^$0|@$1|2|3|4|5|6|7|D|8|@]|9|@]|A|$]]|$1|B|3|-4|5|6|7|E|8|@]|9|@]|A|$]]]|C|$]]

Have you checked the widths of the parent elements? If a width is set too small on a parent element there will not be enough space to render your paragraph and image on the same line. This could cause your paragraph and image to render on different lines.

blocks|key|5749482|text|间距问题很可能是由不正确的闭合标记("")以及同时使用display:+none和visibility:+hidden；|type|unstyled|depth|inlineStyleRanges|entityRanges|data|5749483|可见性会导致元素仍然占用空间，因此您需要摆脱这种样式。|5749484|如果您进行了这些调整，那么它应该可以工作，除非您有其他在提供的代码中看不到的问题(例如：.hidden的父容器有一个拼写错误的类名)。|5749485|提示:切勿使用<+br/+>标签创建空格。它们只用于打破文本。去掉display:+inline；和position:+relative；放在你的另一个<+div+>上，因为把它放在那里是没有意义的(默认是相对定位)。所有标签都是小写的。大写的标签是很久以前的事情了，不是很理想。|5749486|entityMap^0|0|0|0|0^^$0|@$1|2|3|4|5|6|7|J|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|K|8|@]|9|@]|A|$]]|$1|D|3|E|5|6|7|L|8|@]|9|@]|A|$]]|$1|F|3|G|5|6|7|M|8|@]|9|@]|A|$]]|$1|H|3|-4|5|6|7|N|8|@]|9|@]|A|$]]]|I|$]]

The spacing problem is most likely caused by your improperly closed tag ("") as well as using both display: none; and visibility: hidden;

Visibility will cause the element to still take up space so you need to get rid of that style.

If you make those adjustments it should work unless you have other issues not seen in the code provided (for example: your parent container to .hidden having a misspelled class name).

Tips:
Never create space with &lt; br/ > tags. They're only used for breaking text.
Get rid of display: inline; and position: relative; on your other &lt; div > as it doesn't make sense to have it there (relative positioning is default).
Lowercase all of your tags. Uppercase tags are a thing of the distant past and not ideal.

Any ideas how I get rid of white space on my IE browser. It is caused by a hidden div. When I remove the div the white space goes. Works fine in FF.

Here is the DIV:

<pre><code> &lt;div class="hidden" id="popup"&gt;
 &lt;div&gt;
 &lt;H1 class="center" id="popupTitle"&gt;&lt;/H2&gt;&lt;br/&gt;&lt;br/&gt;&lt;br/&gt;
 &lt;div style="position:relative; display:inline;"&gt;
 &lt;p id="popupText" style="float: left"&gt;&lt;/p&gt;
 &lt;img id="popupImage" style="float: right"&gt;&lt;/img&gt;
 &lt;/div&gt;
 &lt;/div&gt;
&lt;/div&gt;
</code></pre>

Here are the styles associated with it:

<pre><code>.ofCommunications .hidden { display:none; visibility: hidden; }
</code></pre>

I am also trying to get the p and the img inside the third div to display on the same line but that doesn't seem to be working either.

Thanks in advance
Caroline

css - hidden div has large white space in its place in IE

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

任何想法，我如何摆脱我的IE浏览器上的空白。它是由隐藏的div引起的。当我删除div时，空格就消失了。在FF中工作正常。以下是DIV： <div class="hidden" id="popup"> <div> <H1 class="center" id="popupTitle"></H2><br/...

问css - hidden div在IE中的位置有很大的空白
EN

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问css - hidden div在IE中的位置有很大的空白EN