帮助制作无障碍布局 [英] help making an accessible layout

问题描述

提前感谢任何可以提供帮助的人。


我正在制作一个简单的布局，我想确保它尽可能地让人们接触到残疾人（屏幕阅读器等）我正在使用定位来布局所有元素，我遇到了以下问题：


1.我不能得到左右列在他们的容器div的顶部对齐

2.在Safari中，页脚div消失

3.在IE中它只是一个完全混乱


我很精通CSS，但我很难过！


HTML at：

http://granthansen.com/test/positioning2.html


CSS位于：

http://granthansen.com/ test / styles2.css


我希望它的外观概要是：

http://granthansen.com/test/homepage.gif



谢谢!!!!!!!

Thanks in advance to anyone who can help.

I''m working on a somewhat simple layout and I want to make sure it''s as accessible as possible to people with disabilities (screen readers, etc.) I''m using positioning to layout all the elements and I''m running into the following problems:

1. I can''t get the left and right columns to align at the top of their container div
2. In Safari, the footer div disappears
3. In IE it''s just a total mess

I''m pretty CSS savvy, but I''m stumped!!!

HTML is at:
http://granthansen.com/test/positioning2.html

CSS is at:
http://granthansen.com/test/styles2.css

Outline of what I want it to look like is:
http://granthansen.com/test/homepage.gif


THANKS!!!!!!!

推荐答案

作为后续行动，页脚在我放入所有100％的高度之前，它并没有在Safari中消失。

Just as a follow-up, the footer didn''t disappear in Safari until I put in all the 100% heights.

中间列是html中遇到的第一个元素，它向左浮动，但它有一个边距左200px。这样就阻止了内容一直向左移动。所以左栏是左栏。只能浮动到中间列的右边缘。


只需移动html中间列前面的左列，摆脱中间列的边距。然后你可以根据需要调整左栏的左边距。


稍微多一点。

The middle column is the first element encountered in the html and it is floated left, but it has a margin of left 200px. So that blocks the content from going all the way to the left. So the "left column" can only float as far as the right edge of the middle column.

Just move the left column in front of the middle column in the html and get rid of the margin in the middle column. Then you can adjust the left columns left margin if necessary.

More in a bit.

感谢您的回复...但是，我将中间内容放在代码中的第一位，以便显示最相关的副本。首先左栏将是大量的文字链接，所以屏幕阅读器必须通过所有这些才能得到任何值得阅读的内容....


我明白什么你的意思是关于中间的浮动阻止内容...谢谢。我会继续工作： - ）

Thanks for the reply ... however, I positioned the middle content first in the code so that it displays the most relevant copy. first The left column will be a ton of text links, so a screen reader will have to get through all that before it gets to anything worthwhile to read....

I understand what you mean about the float left in the middle blocking the content ... thanks. I''ll continue to work :-)

这篇关于帮助制作无障碍布局的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！