No I'm not looking for a column layout, but the ability to place a box on the page where I want it visually, but also where I want it in the document flow in case a screen reader is reading the page.
-----Original Message----- From: David Laakso [mailto:da...@chelseacreekstudio.com] Sent: Wednesday, September 22, 2010 5:41 PM To: Angela French Cc: 'css-d (css-d@lists.css-discuss.org)' Subject: Re: [css-d] positioning of sidebar accessibility validation issue On 9/22/10 6:54 PM, Angela French wrote: > Hello, > > I'm got a problem with pages in my site that have a floating sidebox. They > LOOK fine, but they are not accessible in terms of a semantic document > outline. The problem is that the headings I have given my sidebar box aren't > correct in terms of their position in my document flow (the code). So my > goal is to put in a semantically correct headline, but have the sidebar > appear in the document flow in a correct location for the context of the > content. For instance, on this page > (http://checkoutacollege.com/GetStarted/HSCompletion.aspx ) I would like to > make the sidebar heading an<h2>, keep it where it is positioned visually, > but have it located in the document flow (the code) right after the "What > About State Testing" section. This is where, if the user was using a screen > reader, or had turned off CSS, I would want them to encounter the content. > > If anyone could tell me some general principles about that sort of thing I'd > appreciate it. Or refer me to some web sites. I did a Google search, but I > don't think my search keywords were on track. > > I tried moving the content in the source code to where I want it, then > absolutely positioning the sidebar box up where I want it, but that just > layered the text blocks. I'm hoping this won't require major restructuring > of the page layout, but I'm afraid it might. I do want to keep the main > content "reaching" under the sidebar box. > > Thank you, > > > Angela French Assuming I understand your question, the so-called "negative-margin" layout concept meets that need. Most of these are spin-off of this layout [1]. And include more recent examples such as these [2]. [1] <http://www.alistapart.com/articles/negativemargins/> [2 <http://blog.html.it/layoutgala/> Best, ~d -- :: desktop and mobile :: http://chelseacreekstudio.com/ ______________________________________________________________________ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
