1 / 12

CSS Positioning vs. HTML Tables: HELP!

Explore the ongoing debate between CSS positioning and HTML tables in web design. This guide discusses the advantages and challenges of CSS positioning, such as better design control and accessibility, while addressing frustrations with browser compatibility. Learn how traditional table layouts provide consistent rendering across browsers but may limit design flexibility. The author shares insights and experiences with both methods and offers valuable tips for web designers navigating this complex landscape. Join the conversation about finding optimal solutions for modern web design.

nakia
Télécharger la présentation

CSS Positioning vs. HTML Tables: HELP!

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. CSS Positioning vs. HTML Tables:HELP! Jean ReisingFermilab

  2. CSS Introduced • YEAH!!! • Easy way to update pages • Better control of design

  3. CSS Positioning Introduced • Boo!!! • In concept, yeah!!! • Create a layer • Add text or design element • Move anywhere • Easy and quick intricate design • Page more accessible • No need for a table, w/in a table, w/in a table

  4. Sing it Mick • You Can’t Always Get What you Want

  5. Case in Point • http://lss.fnal.gov/interlab/benefits_table.html • Table layout stays consistent across all browsers – pretty • However, take out the table and use CSS positioning, and . . . . . .

  6. Case in Point (cont’d) • http://lss.fnal.gov/interlab/benefits_css_netscape.html • http://lss.fnal.gov/interlab/benefits_css_firefox.html • Page breaks in Netscape • Page breaks in Firefox

  7. Case in Point #2 • http://lss.fnal.gov/interlab/css_example1_ie.html • In IE, pretty • But, I’m hearing Mick again . . . . • http://lss.fnal.gov/interlab/css_example1_netscape.html • http://lss.fnal.gov/interlab/css_example1_firefox.html

  8. Frustrating • If I was getting what I wanted, using CSS, the page would have been designed in 10 minutes • Since the CSS pages broke, design time increased to over 30 minutes – not to mention wasted time it took to try to get CSS to work

  9. What to Do? • Keep using tables? So much for accessibility (Sorry W3C) • Use CSS?Pray no one uses Firefox • Find a work around?How? • Wait until browsers catch up to W3C recommendations?

  10. Final Thoughts • Be aware if designing in CSS positioning for the first time • If you have had success, send me tips, tricks, work-arounds

  11. Jean Reising joan@fnal.gov 630-840-6010

  12. Disclaimer • To optimally view this site, come to my office and I’ll show it to you on my system!

More Related