CSSADV: Cascading Style Sheets (CSS) - Level 2 & 3 / Advanced

Start Date Time Days Price GTR Availability
November 08, 2017 09:00 (EST) 2 $1,100.00 Register

Course Description

Advanced Course.

Prerequisites

Completion of the introductory course or extensive practical experience with Cascading Style Sheets.

Introduction to Advanced CSS

  • Standards-based CSS versus Browser-based CSS
  • Typical Compromises graphic appeal
  • Usability
  • Browser compatibility
  • Basic Browser Compatibility versus Advanced Browser Compatibility
  • Browser CSS Support IE6-IE7
  • Internet Explore for Mac, Firefox, Mozilla, Safari, Opera, etc.

Advanced design goals quality and diversity through modularisation

  • The Elephant Traps classic errors and problems in advanced CSS web design
  • Advanced CSS Browser Modes and Browser Detection
  • Quirks Mode vs Standards Mode vs Almost Standards Mode
  • Standards Mode and the Standard Box Model
  • Standards Mode Selection by DOCTYPE
  • Forcing IE into Standards Mode
  • Barriers To Enforcing Standards Mode For XHTML
  • Browser Detection And-Or Object Detection
  • Browser Detection Tips
  • Browser-specific CSS
  • Modular Stylesheets
  • Filters And CSS hacks 

Advanced CSS Box Models

  • A Recap of Key CSS Concepts normal flow
  • Replaced-element
  • Block-level element
  • Inline element
  • Root element
  • Containing block
  • The W3C Standard Box Model
  • Windows IE Box Models – Width –
  • Windows IE Box Model – Height –
  • Managing the IE-Win Box Model in CSS
  • Forcing W3C Standard Widths In IE-Win
  • The Tan Hack A Reliable CSS Hack 

Advanced CSS Float Models

  • Typical Problems With Floats in CSS
  • Standards Vs IE Float Models
  • The IE Float Model
  • Clearing a Float Within Its Container
  • Uncontained Floats the Standard Default
  • Clearing a Float with after
  • Floats
  • Content and Overlapping
  • Over-Wide Replaced Content in Floated Containers
  • Over-Wide Images In Floats 

Automatic Box Sizing in Advanced CSS

  • Setting Heights and Widths with auto
  • Auto Width Properties in CSS
  • Auto Height Properties in CSS
  • Auto for Basic Horizontal Sizing
  • More Than One Horizontal auto Setting
  • Auto and Percentage Box Sizing Gotchas 

Advanced CSS Positioning and Offsets

  • Recap on CSS Positioning Types static positioning
  • Relative positioning
  • Absolute positioning
  • And fixed positioning
  • The Containing Block and the Parent Block
  • The Containing Block For Absolute Elements
  • CSS Positioning Using Offsets versus Width and Height
  • Width and Height in CSS Positioning
  • Minimum and Maximum Dimensions Standard CSS Properties – min-width
  • Max-width
  • Min-height
  • Max-height – versus IE Default Behaviour 

Common Browser Bugs and Common CSS Problems

  • The Most Common Problems in Everyday Practice
  • Valid CSS and Valid HTML
  • MIME Types
  • Media Type Glitches
  • FOUC The Flash of Unstyled Content
  • Source Code Whitespace Not Ignored
  • Resource Paths
  • IE Text Size Bug
  • Link Pseudo-Class Order – LVHA –
  • Unintentionally Styled Anchors
  • List Zeroing
  • Missing Floats
  • Unclickable Links
  • Ignored Top Margins 

Protruding Top and Bottom Margins

  • Protruding Floats in IE
  • The Holly Hack
  • The 3 Pixel Jog – Text Jog
  • 3 Pixel IE Bug –
  • The Peek-a-Boo Bug
  • Peekaboo Bug Fixes
  • The WinIE Guillotine Bug
  • Guillotine Bug Fixes
  • The IE Click Bug
  • The IE Justified Italics Bug
  • The Windows IE Unscrollable Content Bug
  • The IE Double Float Margin Bug
  • The WinIE Creeping Text Bug
  • The IE6 Duplicate Character Bug