Whoa whoa.... tables -> div/span?
Moderator: General Moderators
- no_memories
- Forum Contributor
- Posts: 145
- Joined: Sun Feb 01, 2004 7:12 pm
- Location: New York City
Bech100:
It can be done easily. I did a layout for dr. evil done not to long ago that is similar to what you have shown.
http://forums.thexvector.us/viewtopic.php?t=39
if you would like some assistance, I would be more than happy to help you out.
It can be done easily. I did a layout for dr. evil done not to long ago that is similar to what you have shown.
http://forums.thexvector.us/viewtopic.php?t=39
if you would like some assistance, I would be more than happy to help you out.
- andre_c
- Forum Contributor
- Posts: 412
- Joined: Sun Feb 29, 2004 6:49 pm
- Location: Salt Lake City, Utah
I think this is a good example of using divs for layout, please keep in mind that this page is far from being finished. I am most proud of the colorpickers that i wrote (but that's another topic). I would apreciate some comments about it too (probably another topic too). But overall i think is a good example since it is very compatible and looks almost the same on all fairly standard browsers.
manage.directresponsewebsite.com
username: dev, password: network
The design section is almost finished
manage.directresponsewebsite.com
username: dev, password: network
The design section is almost finished
CSS is implemented perfectly well across all major browsers in use today. There are many great features that are only available in new-generation browsers (in other words, NOT Internet Explorer), but none of these are essential for most layout tasks in any way. The only real exception is Mac IE, which has terrible CSS interpretation across the board. But it's dying a quick and well-needed death now.
Statements like "css is not implemented 'consistently' across all browsers and therefore givens inconsistsnet look on different browsers" are only slightly true. Usually these sorts of comments and complaints about how CSS doesn't really work come from someone who is used to designing for IE first, then fixing for other browsers. I know because I used to do it myself, and boy did I complain! You need to adopt the opposite approach: test your pages first and foremost in a browser like Firefox or Safari, THEN check to see what's broken in IE. It takes much less time to fix problems this way.
There are still uses for tables. But for most cases, layout isn't one of them.
Statements like "css is not implemented 'consistently' across all browsers and therefore givens inconsistsnet look on different browsers" are only slightly true. Usually these sorts of comments and complaints about how CSS doesn't really work come from someone who is used to designing for IE first, then fixing for other browsers. I know because I used to do it myself, and boy did I complain! You need to adopt the opposite approach: test your pages first and foremost in a browser like Firefox or Safari, THEN check to see what's broken in IE. It takes much less time to fix problems this way.
There are still uses for tables. But for most cases, layout isn't one of them.
andre_c: that's an interesting site. I really like the way you've handled the functionality of the edit pages section, it's very easy and intuitive. If you want a few gripes, they are:
1) that logo is very hard to read
2) the text doesn't center properly on the tabs
3) the bottom entry of any of the side menus gets clipped by the corner graphics.
1) that logo is very hard to read
2) the text doesn't center properly on the tabs
3) the bottom entry of any of the side menus gets clipped by the corner graphics.
- no_memories
- Forum Contributor
- Posts: 145
- Joined: Sun Feb 01, 2004 7:12 pm
- Location: New York City
How true. I agree whole heartedly with this statement. Yes, I.E. has limitations, but using CSS and DIVs in various ways can minimze those limitations.Unipus Says:
Statements like "css is not implemented 'consistently' across all browsers and therefore givens inconsistsnet look on different browsers" are only slightly true. Usually these sorts of comments and complaints about how CSS doesn't really work come from someone who is used to designing for IE first, then fixing for other browsers.
Not necessarily. I "design" and code the client-side stuff in Firefox, then run it in Opera and IE. External CSS and relative paths in IE is stuff of nightmares. Then, and that's slightly off-topic, have you ever tried the Javascript implementation of RegEx in IE? Gruesome.no_memories wrote:How true. I agree whole heartedly with this statement. Yes, I.E. has limitations, but using CSS and DIVs in various ways can minimze those limitations.Unipus Says:
Statements like "css is not implemented 'consistently' across all browsers and therefore givens inconsistsnet look on different browsers" are only slightly true. Usually these sorts of comments and complaints about how CSS doesn't really work come from someone who is used to designing for IE first, then fixing for other browsers.
Hence, I do my desgin in Firefox, where things are nice and beautiful, then port to IE. And at the same time, I moan about CSS and cross-browser issues.
What IE are you talking about? I've used external and relatively pathed stylesheets for quite some time now, with no problems ever that I can recall. I find that IE can generally be brought within acceptable tolerances pretty easily in terms of positioning and borders and such. Mac IE is a huge pain in the ass, so much so that I try to exclude it from as many projects as I can, but even that can be dealt with if you're willing to make sacrifices.
I mean, CSS is the stuff of perfectionism, and every now and then there will be some little problem that just doesn't want to go cross-browser and you'll bang your head trying to get it right. But for the most part I find it goes pretty smoothly and even with that occasional head-banging more hours are saved than I could count.
I mean, CSS is the stuff of perfectionism, and every now and then there will be some little problem that just doesn't want to go cross-browser and you'll bang your head trying to get it right. But for the most part I find it goes pretty smoothly and even with that occasional head-banging more hours are saved than I could count.
- llanitedave
- Forum Commoner
- Posts: 78
- Joined: Thu Jan 15, 2004 11:24 am
- Location: Las Vegas, NV.
My number one complaint about IE implementation of CSS is its nonrecognition of "fixed" positioning. That forces me to consider using frames, which I despise.Unipus wrote:What IE are you talking about? I've used external and relatively pathed stylesheets for quite some time now, with no problems ever that I can recall. I find that IE can generally be brought within acceptable tolerances pretty easily in terms of positioning and borders and such. Mac IE is a huge pain in the ass, so much so that I try to exclude it from as many projects as I can, but even that can be dealt with if you're willing to make sacrifices.
I mean, CSS is the stuff of perfectionism, and every now and then there will be some little problem that just doesn't want to go cross-browser and you'll bang your head trying to get it right. But for the most part I find it goes pretty smoothly and even with that occasional head-banging more hours are saved than I could count.
Here is a quick and dirty implementation of a site that has a block of contents with links on the left side of the page. On every browser but Internet Explorer the block stays put when the page is scrolled. On IE, it scrolls out of sight.
I really don't want to have to use frames for a functionality that's so simple everywhere else.
CSS Consistency
This is very true and the problem is not limited to Internet Explorer or any other single browser as some have suggested. Yes, Internet Explorer for Windows is the worst offender when it comes to CSS support, but there remains inconsistency between the other browsers as well.malcolmboston wrote:css is not implemented 'consistently' across all browsers and therefore givens inconsistsnet look on different browsers
Try designing a multi-column page layout with centered content of a specific width, variable column heights--keeping in mind that you do not know for sure whether the main content or other columns will be longer, but everything needs to be aligned at the top--and a footer that follows these variable height columns and make all of the dimensions--including margins--identical under a recent version of Gecko (Mozilla, Firefox, etc.) for any platform, the most recent version of Opera for any platform, and the most recent version of Internet Explorer for Windows (the Mac version exists now only in a zombie-like state and can now be safely ignored in most cases). You can even skip KHTML-based browsers for now. If you make a serious effort, this little exercise should reveal to you some significant differences in CSS support.
@llanitedave:
I really don't think that functionality is worth the tradeoff of using frames. Look at it this way: the menu still functions the same, it's still accessible, it just doesn't display in the same manner you wanted before. In my opinion, that puts it many steps ahead of using frames still.
Also, if you REALLY wanted to have it work on most IE clients, it wouldn't be too hard to do in javascript. And again, it would degrade nicely for users without.
@brian:
I've seen it done. Sure, it's not terribly easy. On the other hand: "make all of the dimensions--including margins--identical under a recent version of Gecko"... sounds like unreasonable expectations for the moment. I think you'd be able to accomplish the task fairly easily if you built a little bit of fault tolerance into the design.
I really don't think that functionality is worth the tradeoff of using frames. Look at it this way: the menu still functions the same, it's still accessible, it just doesn't display in the same manner you wanted before. In my opinion, that puts it many steps ahead of using frames still.
Also, if you REALLY wanted to have it work on most IE clients, it wouldn't be too hard to do in javascript. And again, it would degrade nicely for users without.
@brian:
I've seen it done. Sure, it's not terribly easy. On the other hand: "make all of the dimensions--including margins--identical under a recent version of Gecko"... sounds like unreasonable expectations for the moment. I think you'd be able to accomplish the task fairly easily if you built a little bit of fault tolerance into the design.
