宽< table>的垂直位置在3列< div> CSS [英] vertical position of wide <table> in 3 column <div> css

查看:50
本文介绍了宽< table>的垂直位置在3列< div> CSS的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是新的(ish)来css,舒服地使用桌子,但是真的很努力地离开。


请参阅 http://84.9.125.31/developer/css_test/test5.html


NB此问题适用于IE& Opera - 我已经尝试过IE 6& 7,两者都有相同的结果。它在FF中工作正常。感谢Petr Stanicek的原始示例。


正如您所看到的,中间列中的表格宽度为800px,并且它的垂直位置受到文本数量的影响。左侧或右侧列 - 如果表格比中间列宽,您可能需要将屏幕分辨率设置为1024x768。如果它小于中间宽度< div>垂直位置很好。


添加css位置:绝对;到''#ft''规范的工作原理是表格现在显示在中间列的正确垂直位置,参见 http://84.9.125.31/developer/css_test/test6.html ,但左栏中的文字在网格下方流出,击败了对象。


鉴于有一个解决方案,所使用的表格将是任意数量的列,并且可能比800px宽得多。我已经看到很多关于非标准的合规性和展示:表;但是我对垂直位置问题比对宽度/滚动感兴趣。


任何帮助/指针都会得到很好的接收。

I''m new(ish) to css, comfortable using tables, but trying real hard to move away.

Please see http://84.9.125.31/developer/css_test/test5.html

NB This issue is with IE & Opera - I''ve tried IE 6&7 and both have the same result. It works fine in FF. Thanks to Petr Stanicek for the original example.

As you can see the table is 800px wide in the middle column and it''s vertical position is affected by the amount of text in the left or right hand columns - if the table is wider than the middle column, you may need your screen res set to 1024x768. If it''s less than the width of the middle <div> the vertical position is fine.

Adding css position:absolute; to the ''#left'' spec works in that the table is now dispalyed at the correct vertical position in the middle column, see http://84.9.125.31/developer/css_test/test6.html , but the text in the left column flows out below the grid, defeating the object.

Given that there is a solution, the tables used will be any number of columns and could be a lot wider than 800px. I''ve seen a lot about non-standards compliance and display:table; BUT I''m more interested in the vertical position issue than the width/scrolling.

Any help/pointers would be greafully received.

推荐答案

Haven'没有测试,看看它是否影响了它但验证器抱怨< table>第115行是不允许的。
Haven''t tested to see if this is affecting it yet but the validator complains that <table> on line 115 is not allowed there.



Haven'没有测试过这是否影响了它但验证者抱怨< ;表>第115行不允许在那里。
Haven''t tested to see if this is affecting it yet but the validator complains that <table> on line 115 is not allowed there.



感谢您的快速回复,我认为这一定是因为我在< p>内粘贴了表格。标签。我现在已经移动了它并且它验证了没有错误。


不幸的是,这还没有解决垂直位置问题。

Thanks for the quick response, I think this must have been because I had pasted the table inside the <p> tags. I''ve moved it ouside now and it validates wihtout errors.

Unfortunately this has not fixed the vertical position issues.


我必须离开一会儿。


我在IE7,Opera和FF中查看过它们对我来说都是一样的。我不认为我完全理解桌子的去向。它是保留在所有三列之下还是约束到中间但是随着左列扩展而向下滑动?


IE有一个错误,它扩展div以包含浮动元素。 FF符合标准。 IE,一般情况下,螺旋浮动,但它都是可以修复的。
I have to leave for a while.

I checked in IE7, Opera and FF and they all look the same to me. I don''t think I quite understand where the table is to go. Is it to remain under all three columns or constrained to the middle but ride down as the left column expands?

IE has a bug where it expands divs to contain floated elements. FF honors the standard. IE, in general, screws up floats but it''s all fixable.


这篇关于宽&lt; table&gt;的垂直位置在3列&lt; div&gt; CSS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

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