Adobe Dreamweaver CC CSS Page Layout

Introduction to CSS Page Layouts using Divs

For years, web pages where all about table layout.  Rows, columns, cells and spacer gif files (trust me).  No more.  Now 99% of all pages are about using Divs for all of your Adobe Dreamweaver CC, CSS Page Layout.  Let’s see how this works.

The all important yet mysterious CSS Reset Code(s)

Once you get rolling with Adobe Dreamweaver CC CSS Page Layout, you´ll make a great page, or a great site.  Suddenly, you’ll look in another browser and stuff is just all messed up.  All,,,,,,, I say ALL BROWSERS throw stuff into your pages that you just don’t want.  Trust me.  You’ll find out.  This is why we need the all powerful and useful RESET Code(s).

Float Left, Float Right, What the hell is that all about?

Now that you are running with your Adobe Dreamweaver CC CSS Page Layout, I bet you want to put this column on the left and this column on the right.  How’s that working for you.  If it’s not, then you really want to look at Float left and Float Right.  Who came up with the word Float?

Let´s use CSS Page Layout using Divs and Floats to Make a 3 column Page

You’re floating.  Congratulations!  Let’s take your Adobe Dreamweaver CC CSS Page Layout to the next level baby.

Using Padding and Margins with CSS. Controlling Space around, or in anything.

Padding and Margins are a must to use and understand.  When it comes to Padding, just remember, “If you giveth, you must taketh away.”  Margins, not so much.  You’ll see.

Padding is so much fun, let´s do some more.

Grove on with more CSS Padding.

Creating Links in Web Pages Using CSS 

Now that you have been floatin’ and divin’, and makin’ these great pages, let’s link em up and make more.  Let’s do some navagatin’.

Making Links Different colors on the same page. You are a CSS Pro when you can do this.

With Adobe Dreamweaver CC CSS Page Layout, your pages may be laid out well, but what about the white links in your footer, but you have a white background in your header.  What are you going to do about that?  Don´t you need to make those links in the header a different color?  Let’s do that now.

CSS Rollover Mania. CSS Rollovers are just fun and powerful. Everybody Join the Fun.

CSS Rollovers are a Hoot!  You can put a rollover effect on anything, not just links.  You can put a CSS rollover effect on links, images, divs, backgrounds and more.

The all Powerful, CSS Dropdown Menu. YaaaaaHOOOOOOO!

I saved the best for last.  The 100% CSS drop down menu.  No Javascript, no Jquery, no Flash, pure clean and fast CSS.