CSS Floating Layouts

Gain clarity and skill with CSS floats!
4.1 (12 ratings) Instead of using a simple lifetime average, Udemy calculates a
course's star rating by considering a number of different factors
such as the number of ratings, the age of ratings, and the
likelihood of fraudulent ratings.
156 students enrolled
$75
Take This Course
  • Lectures 25
  • Contents Video: 2.5 hours
    Other: 0 mins
  • Skill Level Intermediate Level
  • Languages English
  • Includes Lifetime access
    30 day money back guarantee!
    Available on iOS and Android
    Certificate of Completion
Wishlisted Wishlist

How taking a course works

Discover

Find online courses made by experts from around the world.

Learn

Take your courses with you and learn anywhere, anytime.

Master

Learn and practice real-world skills and achieve your goals.

About This Course

Published 10/2013 English

Course Description

Ever struggled trying to figure out how to build a floating layout using only elements and CSS? CSS Floating Layouts takes the mystery and headache away, and shows you how to build amazing CSS-based floating layouts from the ground up. With Geoff Blake’s trademark non-jargonny approach, you’ll have fun and learn a heap as you discover the world of floating layouts. You’ll learn about floats and clears, then delve into creating three different types of layouts: flexible layouts, fixed layouts, and combination flexible/fixed layouts…all from scratch, all with floats, all by hand!

What are the requirements?

  • Basic computer skills

What am I going to get from this course?

  • A clear, demystified approach to building floating layouts. You’ll be feeling like a pro in no time!

What is the target audience?

  • Those looking to build a strong foundation in CSS and web layouts

What you get with this course?

Not for you? No problem.
30 day money back guarantee.

Forever yours.
Lifetime access.

Learn on the go.
Desktop, iOS and Android.

Get rewarded.
Certificate of completion.

Curriculum

Section 1: Welcome To CSS Floating Layouts!
00:46

Download the project files here.

A Note About Set Up
Preview
02:42
Section 2: CSS Float Fundamentals
Basic Floating
Preview
10:29
Using Floats On Multiple Items
07:07
Introducing Clear
04:37
A Practical Example: Creating A Thumbnail Gallery With Float And Clear
17:40
Section 3: Building A Flexible Layout
Creating The Basic Structure
04:58
Setting Properties And Testing The Layout
07:30
Inserting The Header
04:20
Inserting The Footer And Finalizing
06:09
Understanding How The Layout Works
03:01
Section 4: Building A Combination Flexible / Fixed Layout
Building The Basic Layout Structure
05:06
Adding In Some Dummy Content
02:13
Setting Properties, Part 1
06:59
Setting Properties, Part 2
07:31
Final Layout Options
07:05
Section 5: Building A Fixed Layout
Setting Up The Stucture
03:39
Setting Properties, Part 1
04:20
Setting Properties, Part 2
12:16
Final Layout Options
07:48
Section 6: Still Want More? Check Out These Exclusive Bonus Lessons!
Building Dreamweaver CS3/CS4 Essential’s Layouts Using Floats, Part 1
08:14
Building Dreamweaver CS3/CS4 Essential’s Layouts Using Floats, Part 2
08:57
Creating Floating Layouts In Dreamweaver
11:45
Section 7: Conclusion
Wrapping It Up
01:58
Request a Course
Article

Students Who Viewed This Course Also Viewed

  • Loading
  • Loading
  • Loading

Instructor Biography

Stone River eLearning, 180,000+ Happy Udemy Students | 320,000+ Students Worldwide

At Stone River eLearning, technology is all we teach. If you're interested in programming, development or design - we have it covered. 

Check out our huge catalog of courses and join the over 320,000 students currently taking Stone River eLearning courses. We currently offer 125+ different technology training courses on our Stone River eLearning website and are adding new courses on hot and trending topics every month. A subscription option is available for those with a real passion for learning.

Ready to start learning?
Take This Course