Re: [WSG] Float-less layouts
Thank u vincent i will try it n get back to u... On Jan 10, 2008 11:50 AM, Thierry Koblentz [EMAIL PROTECTED] wrote: Thierry Koblentz wrote: You're saying that a wrapper is needed to enclose all other elements in a document to give it more meaning? No I'm not. Point out to me where I'm saying that. I said: Why would we need to group containers together if it is not for styling purpose? You answered: Because we're saying that anything in the container belongs together (thematically, content-wise, logically, etc). I said: Do we use a wrapper because it brings more meanings to the document or because it let us center our layout, create faux columns etc.? You answered: To create meaning, of course. So I believe my question made sense. And I'm tired of your lengthy metaphysical argument about meaning. Have fun turning the world into lists. As I said on GAWDS, why not turns sentences into ordered lists of words, and words into ordered lists of letters, next? Surely that would carry more meaning, no? Do I say anywhere people should use lists for everything? Do I even say anywhere people should use lists for construct? I thought the discussion was about the semantic value of DIVs. That's the discussion I was trying to have here. But almost in every single post of yours you mention lists. Get over it or move to the other thread where we do talk about lists. *rolls eyes* what do you think I've been doing since our discussion on GAWDS? ;) -- Regards, Thierry | http://www.TJKDesign.com http://www.tjkdesign.com/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Gitanjali, Web Designer, *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Thierry Koblentz wrote: You're saying that a wrapper is needed to enclose all other elements in a document to give it more meaning? No I'm not. Point out to me where I'm saying that. And I'm tired of your lengthy metaphysical argument about meaning. Have fun turning the world into lists. As I said on GAWDS, why not turns sentences into ordered lists of words, and words into ordered lists of letters, next? Surely that would carry more meaning, no? *rolls eyes* P -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Co-lead, Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ Take it to the streets ... join the WaSP Street Team http://streetteam.webstandards.org/ __ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
On Jan 8, 2008, at 3:30 PM, Patrick H. Lauke wrote: Why would we need to group containers together if it is not for styling purpose? Because we're saying that anything in the container belongs together (thematically, content-wise, logically, etc). On Jan 8, 2008, at 7:56 PM, Thierry Koblentz wrote: Does it prove that DIVs carry more semantics? I'm wondering if the pursuit of semantics might sometimes be taken to unreasonable extremes? Must everything that is contained in the marked-up document contain some semantic value? Must anything that does not have an inherent semantic value be excluded? Surely not. If an element is semantically neutral (as DIV) then it necessarily has no impact on the semantic value of the content contained within. My understanding is that the whole argument against using tables for structure is that that use distorts the semantics of the table's content. I hope this analogy is not too far-fetched, but I don't think anyone would argue that a page or a column is not a semantically neutral container of content in a book, still less that pages should be dispensed with as they don't have any semantic value! Anyone (except perhaps the occasional Kerouac purist...) want to go back to reading scrolls? Parts, chapters, sections, paragraphs, sentences, clauses and individual words (and let's remember that the introduction of the humble space between words was once a revolutionary innovation), even the use of different fonts to represent different voices, are all divisions of content that add something semantically. But the individual page or column is entirely neutral - different editions of a book may have very different page numbers, but it's generally agreed that they are in fact the same book. Also, many books contain empty pages by necessity as part of the binding process - it's laughable to imagine a movement calling for empty pages to be excluded on the grounds that they don't have any meaning. So perhaps it's not too unreasonable to carry the analogy forward and suggest that book is equivalent to website, part is equivalent to site area, chapter is equivalent to web page and page or column is equivalent to DIV? Which would allow for the continued use of P, OL/UL, DL, and the dread TABLE (let's not bring I/EM and B/STRONG into it!) to support their intended semantic roles. None of which, by the way, Thierry, is intended to detract from the skill and ingenuity of your IMPRESSIVE demonstration. Andrew http://www.andrewmaben.net [EMAIL PROTECTED] In a well designed user interface, the user should not need instructions. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
I'm wondering if the pursuit of semantics might sometimes be taken to unreasonable extremes? Must everything that is contained in the marked-up document contain some semantic value? Must anything that does not have an inherent semantic value be excluded? Surely not. If an element is semantically neutral (as DIV) then it necessarily has no impact on the semantic value of the content contained within. My understanding is that the whole argument against using tables for structure is that that use distorts the semantics of the table's content. Thanks for keeping the discussion focused on *DIVs* ;) And yes, that's the whole point I've been trying to make. IMO, the use of DIVs carry no semantic, they are neutral and that's why we can abuse them. Using empty ones to clear elements, using double wrappers, etc. None of which, by the way, Thierry, is intended to detract from the skill and ingenuity of your IMPRESSIVE demonstration. Thanks. I must say I got what I paid for, as I knew the title of the article was provocative :) -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Thierry Koblentz wrote: You're saying that a wrapper is needed to enclose all other elements in a document to give it more meaning? No I'm not. Point out to me where I'm saying that. I said: Why would we need to group containers together if it is not for styling purpose? You answered: Because we're saying that anything in the container belongs together (thematically, content-wise, logically, etc). I said: Do we use a wrapper because it brings more meanings to the document or because it let us center our layout, create faux columns etc.? You answered: To create meaning, of course. So I believe my question made sense. And I'm tired of your lengthy metaphysical argument about meaning. Have fun turning the world into lists. As I said on GAWDS, why not turns sentences into ordered lists of words, and words into ordered lists of letters, next? Surely that would carry more meaning, no? Do I say anywhere people should use lists for everything? Do I even say anywhere people should use lists for construct? I thought the discussion was about the semantic value of DIVs. That's the discussion I was trying to have here. But almost in every single post of yours you mention lists. Get over it or move to the other thread where we do talk about lists. *rolls eyes* what do you think I've been doing since our discussion on GAWDS? ;) -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
i have dont dynamic calender for my site in javascript where i have written styles also.but it is not suporting ie 6. the calender frame is not properly visible on combo box in ie6. please help me out with this problem. On Jan 8, 2008 8:35 AM, Geoff Pack [EMAIL PROTECTED] wrote: Al Sparber wrote: The problem is with the standard. If one gets too hung up on semantic markup then there is the risk of bending the logical or implied semantics of an element to suit ones project. I submit that in the absence of a perfectly specific semantically correct element for a given task, a DIV becomes, by default, the logical choice. It's not by default at all - it's by design: a DIV is exactly the correct element to use when you want to divide a document into divisions or sections. The world, and everything in it, is a list. Ordered or unordered? I guess it depends on your faith or lack of it. Maybe a definition list for the platonists out there. (And I though it was all waves and particles :) James Pickering wrote: Also see the W3C HTML 4.01 Specification: http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV I've read it - see the last link in my last post, where I pointed out the progression of the DIV element in the various HTML specs: 3.2: used to structure HTML documents as a hierarchy of divisions 4.01: a generic mechanism for adding structure to documents 5 (draft): The div element represents nothing at all Geoff *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] *** -- Gitanjali, Web Designer, Ekspertech. 9849784829. *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Geoff Pack [EMAIL PROTECTED] wrote: Thierry wrote (in the linked article, not his post): DIVs are meaningless and cannot represent the structure of a document Really? According to the HTML 3.2 spec, where they first appear: DIV elements can be used to structure HTML documents as a hierarchy of divisions. http://www.w3.org/TR/REC-html32#div Also see the W3C HTML 4.01 Specification: http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV Great find! Did you *check* the given *example*? They are using DIVs and Tables where a Definition List (imho) would be more appropriate :-) And what about the P in there and the SPAN and CLASS? Please check that example and let me know if DIVs are a good fit: http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Thierry wrote (in the linked article, not his post): DIVs are meaningless and cannot represent the structure of a document Really? According to the HTML 3.2 spec, where they first appear: DIV elements can be used to structure HTML documents as a hierarchy of divisions. http://www.w3.org/TR/REC-html32#div Hi Geoff, When using DIV, what translate that hierarchy? Take this page for example: http://tjkdesign.com/articles/css-layout/how-to/step-1.asp Using Lists, you get this: http://tjkdesign.com/articles/css-layout/how-to/step-2.asp Forget the visual display, just look at the fact that UAs do not treat DIVs in any special way. Something they do with lists, be it Visual Browsers or Screen Readers. This may not make Lists better for construct, but it should show that the div element represents nothing at all (as it says in one of the 2 links you posted). Because if we are talking hierarchy and semantics, I think something should reveal the relationship between these elements. In the above example, what are the 2 DIVs used as wrappers (instead of the OLs) if they are not just structural hacks? And what about: div class=clearIt/a How semantic is that? At least with the list construct the wrappers *are* semantic. Anyway, as I said in my article, using OLs instead of DIVs started almost as a joke (and if you've read that article you've noted that I do not advocate their use for construct), but the arguments I hear about DIVs being more semantics than Lists to hold the main sections of a web page let me think that the whole thing may be not that crazy :-) -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
I'd appreciate any comment that would help me improve this article: http://tjkdesign.com/articles/float-less_css_layouts.asp Demo: http://tjkdesign.com/articles/css-layout/ no_div_no_float_no_clear_no_hack_no _joke.asp Nice write-up. One of the issues with this technique: you can't use the 'columns' as a containing block for absolute positioned elements. Another issue: width on a 'table-cell' is more like 'min-width' than 'width'. The cell can expand in width if it contains e.g. long unbreakable text strings (or strings of text with white-space:pre). This can eventually be controlled by wrapping such content in a 'overflow:auto' wrapper, but not always. Hi Philippe, I'm using pre elements in the step-by-step pages and as the last one shows, columns do not expand. http://tjkdesign.com/articles/css-layout/how-to/float-less_fluid_layout_with _min-max_width.asp -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Al Sparber wrote: The problem is with the standard. If one gets too hung up on semantic markup then there is the risk of bending the logical or implied semantics of an element to suit ones project. I submit that in the absence of a perfectly specific semantically correct element for a given task, a DIV becomes, by default, the logical choice. It's not by default at all - it's by design: a DIV is exactly the correct element to use when you want to divide a document into divisions or sections. I agree with this, but not because it is semantically correct, only because we don't have anything better. Actually, I'd say it is the lack of semantics that makes DIVs the tool of choice for construct. -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
When using DIV, what translate that hierarchy? div id=level1 div id=level2 div id=level3I am down the hierarchy :(/div /div /div This may not make Lists better for construct, but it should show that the div element represents nothing at all (as it says in one of the 2 links you posted). I thought DIV represents division, some structural group, some _generic_ container. Because if we are talking hierarchy and semantics, I think something should reveal the relationship between these elements. something — like being in the same DIV? In the above example, what are the 2 DIVs used as wrappers (instead of the OLs) if they are not just structural hacks? Since when using element for the purpose it was created is a hack? At least with the list construct the wrappers *are* semantic. And how many semantic wrappers/containers/whatever are you going to have in the standard? No matter the number there will always be need for the generic one — which DIV is. ... Regards, Rimantas -- http://rimantas.com/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
When using DIV, what translate that hierarchy? div id=level1 div id=level2 div id=level3I am down the hierarchy :(/div /div /div The indentation in the markup? Is whitespace required to make sense of DIVs? The IDs? If we need to use attributes to make sense of it, then it'd appear that DIVs are not that semantic after all. The nesting? See my comment below about this. This may not make Lists better for construct, but it should show that the div element represents nothing at all (as it says in one of the 2 links you posted). I thought DIV represents division, some structural group, some _generic_ container. DIVs are used for this, but do they *mean* this? If yes, then why does the following validate? div class=clearIt/div Because if we are talking hierarchy and semantics, I think something should reveal the relationship between these elements. something — like being in the same DIV? And that's enough? Because in this case the element itself does not translate anything. It is the context in which it is found that conveys the information. With a list I think the markup does a better job at translating hierarchy and relationship since when nesting occurs, the element used *is* different . In the above example, what are the 2 DIVs used as wrappers (instead of the OLs) if they are not just structural hacks? Since when using element for the purpose it was created is a hack? Why would we need to group containers together if it is not for styling purpose? Do we use a wrapper because it brings more meanings to the document or because it let us center our layout, create faux columns etc.? At least with the list construct the wrappers *are* semantic. And how many semantic wrappers/containers/whatever are you going to have in the standard? No matter the number there will always be need for the generic one — which DIV is. Once again, I do not say we should *not* use DIVs, I'm only saying we should not try to make them look for what they are not. -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Thierry and all, I am interested in the excellent and well thought out work you have done with lists here. Intriguing! However (and it's a serious question), in what way do you think that using lists is 'better' than using a simple 2 or 3 -celled table (+ a bit of CSS to style it, naturally). I really don't want to start a war and I'd be interested in sensible answers only! :-) I ask because in one sense they could both be described as semantic 'misuse' : lists for lists, tables for data and all that. Bob www.gwelanmor-internet.co.uk *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Hi Bob, I am interested in the excellent and well thought out work you have done with lists here. Intriguing! Thanks However (and it's a serious question), in what way do you think that using lists is 'better' than using a simple 2 or 3 -celled table (+ a bit of CSS to style it, naturally). I really don't want to start a war and I'd be interested in sensible answers only! :-) I ask because in one sense they could both be described as semantic 'misuse' : lists for lists, tables for data and all that. Just 2/3 cells for the columns using basic markup (no TH, no caption, no summary, etc.)? Personally, I would not go this route, but I don't think it would be that bad. If it saves people from DIVitis and prevent their web site to fall apart in most browsers out there, then why not? I guess I'm going to get hammered for saying this :-) So let me add the following: If I would not go this route, it is because for me it breaks the most important law of all: the separation of the three layers. Using table markup for layout won't let you switch* columns for example. Not that it is something I like to do (as said earlier), but at least *not* using table for markup leaves me that option. * as Georg mentioned one can cheat with rtl/ltr, but that only reverts the sequence. -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Thierry Koblentz wrote: DIVs are used for this, but do they *mean* this? If yes, then why does the following validate? div class=clearIt/div For the same reason that li class=foo/li also validates. Because if we are talking hierarchy and semantics, I think something should reveal the relationship between these elements. something — like being in the same DIV? And that's enough? Yes, since the DOM that's constructed is unequivocal about the structure. It is the context in which it is found that conveys the information. It's the overall document structure and the DOM that results from it. not context. With a list I think the markup does a better job at translating hierarchy and relationship since when nesting occurs, the element used *is* different . From the DOM's perspective, the hierarchy/relationship is clear in just as clear in both cases. Why would we need to group containers together if it is not for styling purpose? Because we're saying that anything in the container belongs together (thematically, content-wise, logically, etc). Do we use a wrapper because it brings more meanings to the document or because it let us center our layout, create faux columns etc.? To create meaning, of course. Once again, I do not say we should *not* use DIVs, I'm only saying we should not try to make them look for what they are not. You'be been trying to make lists fit your view of what a document is P -- Patrick H. Lauke __ re·dux (adj.): brought back; returned. used postpositively [latin : re-, re- + dux, leader; see duke.] www.splintered.co.uk | www.photographia.co.uk http://redux.deviantart.com __ Co-lead, Web Standards Project (WaSP) Accessibility Task Force http://webstandards.org/ __ Take it to the streets ... join the WaSP Street Team http://streetteam.webstandards.org/ __ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
Thierry Koblentz wrote: DIVs are used for this, but do they *mean* this? If yes, then why does the following validate? div class=clearIt/div For the same reason that li class=foo/li also validates. You didn't quote an important part of my reply to Rimantas, who was saying: I thought DIV represents division, some structural group, some _generic_ container. Hence my remark about being allowed to use *empty* DIVs. If their purpose is to be used as containers, then we should use them to contain something. Your LI example is a different matter since being a container is not the *basic* definition of a list item... Because if we are talking hierarchy and semantics, I think something should reveal the relationship between these elements. something — like being in the same DIV? And that's enough? Yes, since the DOM that's constructed is unequivocal about the structure. It is the context in which it is found that conveys the information. It's the overall document structure and the DOM that results from it. not context. The DOM? But we're talking about *reading the source code* and the meaning of DIVs in the markup. For the DOM, it doesn't matter if I use DIVs or LIs. The structure would be the same. Or am I missing your point? With a list I think the markup does a better job at translating hierarchy and relationship since when nesting occurs, the element used *is* different . From the DOM's perspective, the hierarchy/relationship is clear in just as clear in both cases. ok, then I must be missing your point, because we agree that it'd make no difference. So why bringing the DOM into the picture then? Does it prove that DIVs carry more semantics? Why would we need to group containers together if it is not for styling purpose? Because we're saying that anything in the container belongs together (thematically, content-wise, logically, etc). You're saying that a wrapper is needed to enclose all other elements in a document to give it more meaning? What about *body*? If that wrapper is the only child of body I don't see what it brings to the table in term of semantics. You're saying it is important to enclose three sections inside a DIV (i.e. columns) to convey the fact that they belong together (thematically, content-wise, logically, etc)? Sounds like a list construct to me ;) Do we use a wrapper because it brings more meanings to the document or because it let us center our layout, create faux columns etc.? To create meaning, of course. As I say above, what is the meaning of a wrapper over body? Doesn't body implicitly says that anything in there belongs together? -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
From: Thierry Koblentz [EMAIL PROTECTED] My apologies for cross-posting. I'd appreciate any comment that would help me improve this article: http://tjkdesign.com/articles/float-less_css_layouts.asp Demo: http://tjkdesign.com/articles/css-layout/no_div_no_float_no_clear_no_hack_no _joke.asp I'll cross-post, too - since I really like the essence of your approach, though I'm not fully sold on the lists. My opinion notwithstanding, that's a very industrious piece of work. Interestingly, I played with something like that for a Page Pack last year. We just used DIVs, however. The reason we've not felt good releasing it was because of Dreamweaver's inability to render it. Of course, many people on this list probably are not as obsessed with Dreamweaver rendering as on the Adobe forum. Perhaps if your exercise gets a good response (on Adobe's forum), we can reconsider :-) Here is our little exercise, with just non-floated DIVs: http://www.projectseven.com/products/staging/float_not/ -- Al Sparber - PVII http://www.projectseven.com Extending Dreamweaver - Nav Systems | Galleries | Widgets Authors: 42nd Street: Mastering the Art of CSS Design *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
A little history relating to floating-box layouts: http://jp29.org/floatbox.htm James Pickering http://jp29.org/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
My apologies for cross-posting.
I'd appreciate any comment that would help me improve this article:
http://tjkdesign.com/articles/float-less_css_layouts.asp
Demo:
http://tjkdesign.com/articles/css-
layout/no_div_no_float_no_clear_no_hack_no
_joke.asp
I'll cross-post, too - since I really like the essence of your
approach,
though I'm not fully sold on the lists.
The use of lists is not that serious. It was mostly to make the title of
the article more attractive ;)
not felt good releasing it was because of Dreamweaver's inability to
render
it. Of course, many people on this list probably are not as obsessed
with
Dreamweaver rendering as on the Adobe forum. Perhaps if your exercise
gets a
good response (on Adobe's forum), we can reconsider :-)
Dreamweaver users may use a design-time style sheet to make the layout
behave as a float construct.
For example, with my layout they could use the following:
#s1,#s2,#s3 {float:left;overflow:hidden;border:0;}
#ft {clear:left;}
--
Regards,
Thierry | http://www.TJKDesign.com
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Float-less layouts
Does your approach deal with any column any order? Is this a possibility?
Karl
On Jan 8, 2008 6:15 AM, Thierry Koblentz [EMAIL PROTECTED] wrote:
My apologies for cross-posting.
I'd appreciate any comment that would help me improve this article:
http://tjkdesign.com/articles/float-less_css_layouts.asp
Demo:
http://tjkdesign.com/articles/css-
layout/no_div_no_float_no_clear_no_hack_no
_joke.asp
I'll cross-post, too - since I really like the essence of your
approach,
though I'm not fully sold on the lists.
The use of lists is not that serious. It was mostly to make the title of
the article more attractive ;)
not felt good releasing it was because of Dreamweaver's inability to
render
it. Of course, many people on this list probably are not as obsessed
with
Dreamweaver rendering as on the Adobe forum. Perhaps if your exercise
gets a
good response (on Adobe's forum), we can reconsider :-)
Dreamweaver users may use a design-time style sheet to make the layout
behave as a float construct.
For example, with my layout they could use the following:
#s1,#s2,#s3 {float:left;overflow:hidden;border:0;}
#ft {clear:left;}
--
Regards,
Thierry | http://www.TJKDesign.com
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
Re: [WSG] Float-less layouts
OOps sorry, read your demo page and it doesn't. Sure, your visual
tabbing might not be the same, but for semantics and SEO, I think its
fairly important to have major content ahead of secondary content in
source-order. I think it makes it much easier for screen-readers too.
Have you tried to explore the possibility of changing the visual
layout of the columns? Perhaps with negative margins similar to how
its done with floats?
Karl
On Jan 8, 2008 9:24 AM, Karl Lurman [EMAIL PROTECTED] wrote:
Does your approach deal with any column any order? Is this a possibility?
Karl
On Jan 8, 2008 6:15 AM, Thierry Koblentz [EMAIL PROTECTED] wrote:
My apologies for cross-posting.
I'd appreciate any comment that would help me improve this article:
http://tjkdesign.com/articles/float-less_css_layouts.asp
Demo:
http://tjkdesign.com/articles/css-
layout/no_div_no_float_no_clear_no_hack_no
_joke.asp
I'll cross-post, too - since I really like the essence of your
approach,
though I'm not fully sold on the lists.
The use of lists is not that serious. It was mostly to make the title of
the article more attractive ;)
not felt good releasing it was because of Dreamweaver's inability to
render
it. Of course, many people on this list probably are not as obsessed
with
Dreamweaver rendering as on the Adobe forum. Perhaps if your exercise
gets a
good response (on Adobe's forum), we can reconsider :-)
Dreamweaver users may use a design-time style sheet to make the layout
behave as a float construct.
For example, with my layout they could use the following:
#s1,#s2,#s3 {float:left;overflow:hidden;border:0;}
#ft {clear:left;}
--
Regards,
Thierry | http://www.TJKDesign.com
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
***
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
***
RE: [WSG] Float-less layouts
Does your approach deal with any column any order? Is this a possibility? Hi Karl, As it says on this page [1]: The sequence of the columns depends on the source order... As far as I know, display:table doesn't let us play with columns the same way we can do with floats. [1] http://tjkdesign.com/articles/css-layout/no_div_no_float_no_clear_no_hack_no _joke.asp -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
RE: [WSG] Float-less layouts
OOps sorry, read your demo page and it doesn't. Sure, your visual tabbing might not be the same, which can be confusing ;-) but for semantics and SEO, I think its fairly important to have major content ahead of secondary content in source-order. I don't know. In my 5+ years old web site content comes *last*, but still major SE index my articles very well. I think it makes it much easier for screen-readers too. Why? If skip links are properly implemented I don't see the advantage for these users. Have you tried to explore the possibility of changing the visual layout of the columns? Perhaps with negative margins similar to how its done with floats? I gave it a quick try, but I didn't really spend much time on this as I'm not a fan of cheating with the visual flow. -- Regards, Thierry | http://www.TJKDesign.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
From: Thierry Koblentz [EMAIL PROTECTED] I gave it a quick try, but I didn't really spend much time on this as I'm not a fan of cheating with the visual flow. I agree. Skip to links would be the solution. Layout is difficult enough with the existing standards, but source ordering is, in my opinion, largely a wasted effort. If a web designer feels it important to have the main content come first, then that is the way the page should both display and be read. -- Al Sparber - PVII http://www.projectseven.com Extending Dreamweaver - Nav Systems | Galleries | Widgets Authors: 42nd Street: Mastering the Art of CSS Design *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
On Jan 8, 2008, at 1:48 AM, Thierry Koblentz wrote: I'd appreciate any comment that would help me improve this article: http://tjkdesign.com/articles/float-less_css_layouts.asp Demo: http://tjkdesign.com/articles/css-layout/ no_div_no_float_no_clear_no_hack_no _joke.asp Nice write-up. One of the issues with this technique: you can't use the 'columns' as a containing block for absolute positioned elements. Another issue: width on a 'table-cell' is more like 'min-width' than 'width'. The cell can expand in width if it contains e.g. long unbreakable text strings (or strings of text with white-space:pre). This can eventually be controlled by wrapping such content in a 'overflow:auto' wrapper, but not always. Philippe --- Philippe Wittenbergh http://emps.l-c-n.com *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
From: Philippe Wittenbergh [EMAIL PROTECTED] One of the issues with this technique: you can't use the 'columns' as a containing block for absolute positioned elements. Another issue: width on a 'table-cell' is more like 'min-width' than 'width'. The cell can expand in width if it contains e.g. long unbreakable text strings (or strings of text with white-space:pre). This can eventually be controlled by wrapping such content in a 'overflow:auto' wrapper, but not always. I didn't test Thierry's layout, but this page, setting widths on each DIV that is set to display table-cell, seems to behave as expected with respect to overflowed content: http://www.projectseven.com/products/staging/float_not/index2.htm -- Al Sparber - PVII http://www.projectseven.com Extending Dreamweaver - Nav Systems | Galleries | Widgets Authors: 42nd Street: Mastering the Art of CSS Design *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Thierry wrote (in the linked article, not his post): DIVs are meaningless and cannot represent the structure of a document Really? According to the HTML 3.2 spec, where they first appear: DIV elements can be used to structure HTML documents as a hierarchy of divisions. http://www.w3.org/TR/REC-html32#div See also: http://www.mail-archive.com/wsg@webstandardsgroup.org/msg29003.html Geoff *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Geoff Pack [EMAIL PROTECTED] wrote: Thierry wrote (in the linked article, not his post): DIVs are meaningless and cannot represent the structure of a document Really? According to the HTML 3.2 spec, where they first appear: DIV elements can be used to structure HTML documents as a hierarchy of divisions. http://www.w3.org/TR/REC-html32#div Also see the W3C HTML 4.01 Specification: http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV James Pickering Pickering Pages http://jp29.org/ *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
From: Geoff Pack [EMAIL PROTECTED] Thierry wrote (in the linked article, not his post): DIVs are meaningless and cannot represent the structure of a document Really? According to the HTML 3.2 spec, where they first appear: DIV elements can be used to structure HTML documents as a hierarchy of divisions. http://www.w3.org/TR/REC-html32#div See also: http://www.mail-archive.com/wsg@webstandardsgroup.org/msg29003.html Hi Geoff, The problem is with the standard. If one gets too hung up on semantic markup then there is the risk of bending the logical or implied semantics of an element to suit ones project. I submit that in the absence of a perfectly specific semantically correct element for a given task, a DIV becomes, by default, the logical choice. The world, and everything in it, is a list. The danger with that thinking, of course, is that everything in the world is data and can, therefore, be described in the cells of a table :-) -- Al Sparber - PVII http://www.projectseven.com Extending Dreamweaver - Nav Systems | Galleries | Widgets Authors: 42nd Street: Mastering the Art of CSS Design *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Thierry Koblentz wrote: Does your approach deal with any column any order? Is this a possibility? As it says on this page [1]: The sequence of the columns depends on the source order... As far as I know, display:table doesn't let us play with columns the same way we can do with floats. We can reverse column-order with rtl/ltr, and do some more order-tricking between similar-width columns. Example: http://www.gunlaug.no/tos/moa_11h.html Other than that there's not much we can do with CSS tables when it comes to source order vs. visual order. regards Georg -- http://www.gunlaug.no *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
Re: [WSG] Float-less layouts
Al Sparber wrote: The problem is with the standard. If one gets too hung up on semantic markup then there is the risk of bending the logical or implied semantics of an element to suit ones project. I submit that in the absence of a perfectly specific semantically correct element for a given task, a DIV becomes, by default, the logical choice. It's not by default at all - it's by design: a DIV is exactly the correct element to use when you want to divide a document into divisions or sections. The world, and everything in it, is a list. Ordered or unordered? I guess it depends on your faith or lack of it. Maybe a definition list for the platonists out there. (And I though it was all waves and particles :) James Pickering wrote: Also see the W3C HTML 4.01 Specification: http://www.w3.org/TR/REC-html40/struct/global.html#edef-DIV I've read it - see the last link in my last post, where I pointed out the progression of the DIV element in the various HTML specs: 3.2: used to structure HTML documents as a hierarchy of divisions 4.01: a generic mechanism for adding structure to documents 5 (draft): The div element represents nothing at all Geoff *** List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm Help: [EMAIL PROTECTED] ***
