且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

寻求CSS布局的方法建议

更新时间:2022-06-15 09:24:47

2006年4月3日星期一19:25:15 -0500,Jim< Ji *@nospamwanted.com>写道:
On Mon, 03 Apr 2006 19:25:15 -0500, Jim <Ji*@nospamwanted.com> wrote:


我希望有人可以帮助我。我是第一次尝试使用CSS而不是HTML
表来实现页面设计。

我已经能够完成大部分页面了。我有标题区域
,下面有3列。

我的问题在标题区域内。

我想要的是以下内容:

********
* .Logo。*
* .Logo。* ******** ********
* .Logo。* * Image1 * * Image2 *
* .Logo。* ******** ********
* .Logo。*这里有一行文字
* .Logo。*
* .Logo。* NavBtn1 NavBtn2 NavBtn3
********

您可以在这里看到我的实际页面:
http://www.chicagospace.org/testarea/Skel1.html

我的问题是,因为我正在使用浮动,文本行和导航按钮包含在图像的右侧,而不是出现在图像的右侧在两个图像下面 - image1和image2。我尝试过的所有东西都失败了。通常我的解决方案会导致文本和导航按钮的行向下移动到内容区域。

任何建议都将非常感谢。

谢谢。

请将您的回复发布到论坛,因为电子邮件地址是伪造的,以阻止垃圾邮件发送者。
Hi,

I am hoping that someone here can help me out. I am for the first time
trying to implement a page design using only CSS instead of HTML
tables.

I''ve been able to get most of the page done ok. I have my header area
and below it 3 columns.

My problem is within the header area.

What I want is the following:

********
*.Logo.*
*.Logo.* ******** ********
*.Logo.* *Image1* *Image2*
*.Logo.* ******** ********
*.Logo.* A line of text here
*.Logo.*
*.Logo.* NavBtn1 NavBtn2 NavBtn3
********
You can see my actual page here:
http://www.chicagospace.org/testarea/Skel1.html

My problem is that because I''m using floats, the line of text and
navigation buttons wrap up to the right of the images instead of
appearing below the two images - image1 and image2. Everything that I
have tried has failed. Typically my solutions would result in the line
of text and nav buttons getting shifted down into the content area.

Any suggestions would be greatly appreciated.

Thanks.

Please post your reply to the group as the email address is a fake to
foil spammers.




我好像有部分问题解决了。代码:
http://www.chicagospace.org/ testarea / Skel2.html


确实产生了我想要的结果,前提是我没有将文字大小调整为
更大的尺寸,强制导航按钮进入内容

区域。


Skel2.html中的解决方案是否可行?


谢谢。


最诚挚的问候,吉姆
http://www.chicagospace.org/


Jim写道:
Jim wrote:
我好像解决了部分问题。代码:
http://www.chicagospace.org/ testarea / Skel2.html

会产生我想要的结果,前提是我没有将文本调整为更大的尺寸,这会强制导航按钮进入
I seem to have part of the problem solved. The code at:
http://www.chicagospace.org/testarea/Skel2.html

does produce the results I want provided I don''t resize the text to a
larger size, which forces the navigation buttons down into the
content area.




调整大小会破坏您的设计。我将你的hdr的155px高度更改为:


div#hdr {height:13em;


并解决了这个问题。你不应该将px用于那种

大小调整。使用em的某些值而不是调整大小不会成为问题。


哦,考虑放弃Verdana。
http://www.xs4all.nl/~sbpoley/webmatters/verdana.html


-

-bts

-警告:我为草坪鹿刹车



Resizing blows your design. I changed the 155px height of your hdr to:

div#hdr {height:13em;

and solved that one problem. You shouldn''t use px for that kind of
sizing. Use some value of em instead and resizing won''t be a problem.

Oh, and consider dropping Verdana.
http://www.xs4all.nl/~sbpoley/webmatters/verdana.html

--
-bts
-Warning: I brake for lawn deer


>
我似乎解决了部分问题。代码:
http://www.chicagospace.org/ testarea / Skel2.html

会产生我想要的结果,前提是我没有将文本调整为更大的尺寸,这会强制导航按钮进入内容
区域。

Skel2.html的解决方案是否可行?

谢谢。

最诚挚的问候,吉姆
http://www.chicagospace.org/
I seem to have part of the problem solved. The code at:
http://www.chicagospace.org/testarea/Skel2.html

does produce the results I want provided I don''t resize the text to a
larger size, which forces the navigation buttons down into the content
area.

Is the solution in Skel2.html the way to go?

Thanks.
Best Regards, Jim
http://www.chicagospace.org/

>

嗨吉姆


看起来问题类似于quirksmode上描述的问题

http://www.quirksmode.org/css/clearing.html
>
我的理解是你需要从

div#hdr中删除高度设置然后添加溢出:隐藏到相同然后你的

hea当文字大小增加时,der会扩大。


希望这会有所帮助


问候,

Tim



Hi Jim

Looks like the problem is similar to one described on quirksmode

http://www.quirksmode.org/css/clearing.html

My understanding is that you need to remove the height setting from
div#hdr altogether then add overflow:hidden to the same and then your
header will expand when the text size is increased.

Hope this helps

Regards,
Tim