DIV没有换行符 [英] DIV without line breaks

查看:110
本文介绍了DIV没有换行符的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述



我非常关注IE,所以跨浏览器的兼容性并不是必需的。如果您查看下面的代码,我几乎可以得到我正在寻找的


- 一个四个单元格的表格,它扩展/收缩到宽度

浏览器窗口。当它收缩时,单元格永远不会变小(宽度为
宽度),而不是最大的DIV项目。

- 当DIV元素动态变化时,表格单元格保持

的宽度相同(因此,文本的左侧定位

在每次动态DIV更改时都不会改变)。

但是,这是我的问题:


- 第一个DIV元素出现在顶部,第二个DIV元素显示在

下面,当它可见时(我会喜欢

动态元素的顶部和左侧定位出现在同一个位置,基于每个表格单元格/浏览器窗口大小的位置



- 如果我使用绝对定位,表格单元格仍然被绘制得更大

(高度),因为它假定隐藏DIV的第二行。

虽然我已经要求一个DIV没有换行的解决方案,但现在我想起了它,最后一个要点可能仍然存在问题。

有人可以帮忙吗?我宁愿通过直接的

HTML / CSS解决这个问题,而不是一些花哨的JavaScript解决方案,我发现

项目的左上角属性,然后移动第二个DIV到那个

的位置。


如果我在解释我正在尝试的内容方面做得不好,我会道歉

完成。提前感谢您提供给我的任何帮助。


--------------------------- -------------------------------

< html>

< head>

< title> Header Work< / title>

< script language =" JavaScript">

var incArray = new Array(0,0,0,0);

function sfs(num){

var a = document.getElementById(num +" a" );

var b = document.getElementById(num +" b");

if(incArray [num]%2 == 1){

a.style.visibility =" hidden";

b.style.visibility =" visible";

} else {

b.style.visibility =" hidden";

a.style.visibility =" visible";

}

++ incArray [num];

}

< / script>


< / head>


< body>


< table border = 1 cellpadding = 0 cellspacing = 0 width = 100%>

< TR>

< td nowrap>

< div id =" 0a"

style =" visibility:hidden;"> xxxxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx< / div>

< div id =" 0b" style =" visibility:visible;"> aaaaaaaa< / div>

< / td>

< td nowrap>

< div id =" 1a" style =" visibility:hidden;"> cccccccc< / div>

< div id =" 1b" style =" visibility:visible;"> aaaa< / div>

< / td>

< td nowrap>

< div id =" 2a" style =" visibility:hidden;"> ##########< / div>

< div id =" 2b" style =" visibility:visible;"> 2< / div>

< / td>

< td nowrap>

< div id =" 3a" style =" visibility:hidden;"> cdcd< / div>

< div id =" 3b"

style =" visibility:visible; "> aaaaaaaaawwwwwwwwwwwww waaaa< / div>

< / td>

< / tr>

< / table>


< a href =" javascript :sfs(0);">切换第一个空格< / a>< BR>

< a href =" javascript :sfs(1);">切换第二空格< / a>< BR>

< ; a href =" javascript :sfs(2);">切换第3个空格< / a>< BR>

< a href =" javascript :sfs(3);">切换第4个空格< / a>

< / body>

< / html> ;

-

Johnny Two Dogs

-------------------- -------------------------------------------------- -

Johnny Two Dogs的简介: http://www.highdots.com/forums/ member.php?userid = 316

查看以下主题: http://www.highdots.com/forums/showthread.php?t=1543511


I''m strictly concerned with IE, so cross-browser compatibilty isn''t
necessary. If you view the code below, I almost get exactly what I''m
looking for:
- A table of four cells that expands/contracts to the width of the
browser window. When it contracts, the cell never gets smaller (in
width) than the largest DIV item.
- When the DIV elements dynamically change, the table cells remain
the same in width (and as a result, the left positioning of the text
doesn''t change on each dynamic DIV change).
But, here''s my problem:

- The first DIV element appears on top, and the second appears below
when made visible (I''d like the top and left positioning of the
dynamic elements to appear in the same spot, based on where that is
per the table cell/browser window size.
- If I use absolute positioning, the table cell is still drawn larger
(in height) because it assumes the second line of the hidden DIV.
Although I''ve asked for a "DIV without line breaks" solution, now that
I think of it, that last bullet-point might still pose a problem.

Can anyone please help? I''d prefer to solve this through straight
HTML/CSS rather than some gimmicky JavaScript solution whereby I detect
the top-left attributes of items, then move the second DIV to that
location.

I apologize if I''ve done a poor job of explaining what I''m trying to
accomplish. Thanks in advance for any help you can offer me.

----------------------------------------------------------
<html>
<head>
<title>Header Work</title>
<script language="JavaScript">
var incArray = new Array (0,0,0,0);
function sfs (num) {
var a = document.getElementById(num+"a");
var b = document.getElementById(num+"b");
if (incArray[num]%2==1) {
a.style.visibility = "hidden";
b.style.visibility = "visible";
} else {
b.style.visibility = "hidden";
a.style.visibility = "visible";
}
++incArray[num];
}
</script>

</head>

<body>

<table border=1 cellpadding=0 cellspacing=0 width=100%>
<tr>
<td nowrap>
<div id="0a"
style="visibility:hidden;">xxxxxxxxxxxxxxxxxxxxxxx xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</div>
<div id="0b" style="visibility:visible;">aaaaaaaa</div>
</td>
<td nowrap>
<div id="1a" style="visibility:hidden;">cccccccc</div>
<div id="1b" style="visibility:visible;">aaaa</div>
</td>
<td nowrap>
<div id="2a" style="visibility:hidden;">##########</div>
<div id="2b" style="visibility:visible;">2</div>
</td>
<td nowrap>
<div id="3a" style="visibility:hidden;">cdcd</div>
<div id="3b"
style="visibility:visible;">aaaaaaaaawwwwwwwwwwwww waaaa</div>
</td>
</tr>
</table>

<a href="javascript:sfs(0);">Switch 1st space</a><BR>
<a href="javascript:sfs(1);">Switch 2nd space</a><BR>
<a href="javascript:sfs(2);">Switch 3rd space</a><BR>
<a href="javascript:sfs(3);">Switch 4th space</a>
</body>
</html>
--
Johnny Two Dogs
------------------------------------------------------------------------
Johnny Two Dogs''s Profile: http://www.highdots.com/forums/member.php?userid=316
View this thread: http://www.highdots.com/forums/showthread.php?t=1543511

推荐答案

2005年6月22日星期三,Johnny Two Dogs写道:
On Wed, 22 Jun 2005, Johnny Two Dogs wrote:
我严格关注IE,所以跨浏览器的兼容性不是<必要的。
I''m strictly concerned with IE, so cross-browser compatibilty isn''t
necessary.




那么你在这做什么呢?这个小组用于为WWW创作HTML





So what on Earth are you doing here? This group is for authoring HTML
for the WWW.


Johnny Two Dogs写道:
Johnny Two Dogs wrote:
我严格关注IE




那么也许你不应该在WWW创作小组中询问。



Then perhaps you shouldn''t be asking in a WWW authoring group.



我很困惑。我是否发布到了错误的论坛,或者你不喜欢它?

我的主要关注点是Internet Explorer的工作解决方案?如果

它是后者,请假装我的第一句话从来没有

存在。如果它是前者,请有人指导我到

适当的论坛吗?无论哪种方式,有用的反应都会很棒。

-

Johnny Two Dogs

----------- -------------------------------------------------- -----------

Johnny Two Dogs的简介: http://www.highdots.com/forums/member.php?userid=316

查看此主题: http://www.highdots.com/forums/showthread.php? t = 1543511


I''m confused. Did I post to the wrong forum, or did you not like that
my primary concern is a working solution for Internet Explorer? If
it''s the latter, please pretend that 1st sentence of mine never
existed. If it''s the former, would someone please direct me to the
proper forum? Either way, a useful response would be fantastic.
--
Johnny Two Dogs
------------------------------------------------------------------------
Johnny Two Dogs''s Profile: http://www.highdots.com/forums/member.php?userid=316
View this thread: http://www.highdots.com/forums/showthread.php?t=1543511


这篇关于DIV没有换行符的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆