Email Print Bookmark

CSS Masterclass

Why CSS?

Adobe Authorised Training Centre

Proficient use of CSS (Cascading Style Sheets) enables web designers to create sites that:

  • are quicker and easier to develop and maintain,
  • download faster,
  • are visually consistent,
  • are more accessible,
  • provide a better user experience and
  • rank better with search engines.

Who should do this course?

Anyone who is already using CSS-based layouts but has encountered problems with making CSS designs work in multiple browsers and who wishes to understand the impact of Internet Explorer 7 on existing websites. Participants should have completed the Advanced Website Design Using CSS course or have equivalent knowledge prior to commencing this course. A sound understanding of both XHTML and CSS (including creating layouts with both floats and positioning) is assumed.

About the course:

During this 3 day course, participants will learn how to:

  • use advanced CSS selectors,
  • understand the cascade, specificity, and inheritance,
  • use background images to create round-cornered boxes and drop shadows,
  • use PNG alpha transparency,
  • create complex buttons and rollovers,
  • apply conditional comments and band pass filters for Internet Explorer,
  • create liquid and elastic layouts,
  • employ a variety of hacks and filters to hide and/or show CSS to specific browsers,
  • learn a systematic approach to bug hunting, and
  • squash a range of common CSS bugs.
 

Quick Facts

Level: Advanced Price: $1650.00 incl GST You will receive:
Duration: 3 Days Discounts*: 2 Students - 10% - Certificate of completion
Size: 10   3 Students - 15% - Training Manual
Times: 9.00am to 5.00pm approx   4 Students - 20% - 12 months FREE email support*
Pre-requisites: Refer to course description Bonus: 2 FREE - FREE class re-sit (if necessary)*
      Movie Tickets Course Brochure:
     
CSS_Masterclass.pdf
         
 * Conditions apply.
 

Upcoming Courses

Sydney

Level 11, 32 Walker Street
North Sydney
View map

Date:
16-18 Mar 10
27-29 Apr 10
07-09 Jun 10

Melbourne

Level 12, 379 Collins Street
Melbourne
View map

Date:
17-19 Mar 10
16-18 Jun 10

Brisbane

C/- Support Technology, Level 6, 371 Queen St
Brisbane
View map

Date:
19-21 Apr 10

Canberra

C/- Training Choice, Level 12, 15 London Circuit
Canberra
View map

Date: upon demand

Adelaide

C/- Mindfull Computer & Seminar, Level 4, 74 Pirie Street
Adelaide
View map

Date: upon demand

For more information on dates or locations, please call 1300 888 724 or enquire online.

Course Units

Unit 1: CSS Foundations
- Structuring code correctly
  • Meaningful markup
  • DOCTYPE switching and browser modes
  • Validation
- Advanced CSS selectors
  • Universal selector
  • Child and adjacent sibling selectors
  • Attribute selectors
- The cascade and specificity
- Inheritance
- Planning, organising, and maintaining stylesheets
  • Adding and removing comments
  • Optimising your stylesheets
  • Style guides
Unit 2: The Visual Formatting Model
- The CSS Box Model
  • IE/Win and the box model
  • Margin collapsing
- Positioning
  • Visual Formatting model
  • Relative positioning
  • Absolute positioning
  • Fixed positioning
- Floating
Unit 3: Background Images
- Rounded-corner boxes
  • Fixed width
  • Flexible
- Drop-shadows
  • Easy CSS drop shadows
  • Clagnut drop shadow
  • Fuzzy shadows
- Fluid Images
Unit 4: Image Replacement
- Using bitmaps
  • Fahner method
  • Phark method
  • Gilder/Levin method
- Using Flash
  • Inman Flash Replacement
  • Scaleable Inman Flash Replacement
Unit 5: Advanced Link Styling
- Fancy link underlines
- Highlighting different types of links
- Highlighting downloadable documents and feeds
- Visited link styles
Unit 6: Buttons and Rollovers
- Simple rollovers
- Image rollovers
- Pixy-style rollovers
Unit 7: Styling Lists and Navigation Bars
- Basic list styling
- Creating a vertical navigation bar
- Highlighting the current page in a nav bar
- Creating a horizontal navigation bar
Unit 8: More Complex Navigation
- CSS Tabs
- CSS image maps
- Dropdown menus
Unit 9: Advanced Layout
- Centering a design
  • Using positioning
  • Using negative margins
- Float-based layouts
  • Two-column layout
  • Three-column layout
- Liquid and elastic layouts
- Faux columns
Unit 10: Introduction to hacks and filters
- Using hacks sensibly
- Filtering separate stylesheets
  • Internet Explorer conditional comments
  • Band pass filters
- Applying IE conditional comments
Unit 11: Filtering individual rules and declarations
- Child selector hack
- Attribute selector hack
- Star HTML (* HTML) hack
- Escaped property hack
- Tantek's box model hack
- Modified simplified box model hack
- The important and underscore hacks
- Owen hack
Unit 12: Bugs and Bug Fixing
- A systematic approach to bug hunting
- Recognizing common CSS problems
  • Specificity and sort order
  • Margin collapsing
- Bug hunting basics
  • Isolate the problem
  • Create a minimal test case
  • Fix the problem, not the symptoms
  • Ask for help
- Understanding IE's rendering engine
  • What is "layout"?
  • What is the effect of "having layout"?
- Common bugs and their fixes
  • Double-margin float bug
  • Three-pixel text jog bug
  • IE6 duplicate character bug
  • IE6 peek-a-boo bug
  • Absolute positioning within a relative container
Man and woman sitting at a computer SEEK logo