Dreamweaver CS4 Tutorial - 16 - More on Page Layouts Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software

hey and welcome back to the second part
of our page layout tutorial using CSS
with fix and liquid layouts now that we
have created our div from the first
tutorial we are going to take these divs
and we're going to style them so go over
to your CSS panel click on new CSS rule
and change it to ID give it a name of
wrapper and leave this document only say
ok and let's change the background color
to black and go to box and set the width
through seven hundred and sixty pixels
apply and say ok now we are going to
create another rule we're going to call
this one main and it's going to be an ID
as well so same main ok and let's give
this a background color of whatever you
like but I'm going to give it a blue
color and I'm going to set that with to
let's say 400 pixels ok all right now
let's create one called left make sure
you select ID say ok let's give this a
background color say me hungry
go to boxing let's give it a width of
say 150 okay create one more i'll change
it to ID and set it right ok and let's
change the background too let's give it
a red color and change the width to 100
pixels now that we have set our IDs
we're going to go inside the parent div
I'm going to give an ID of rapper there
we go and now we are going to give the
first one in ID the left let's get the
second one an ID made
and the last one we're going to call it
the right I can see that it has all the
different colors that we've sat in here
now that we have set those dips we're
going to go inside our CSS selector and
let's go inside of our main go down here
to float and select left and now we're
going to the same thing for the left and
the right box float left all right and
right we're going to say box float left
and apply now we see what we've done
here is made it so our div tags now will
not be below each other but they will
float so that is how we create diff Tex
and we apply so back on color styles to
them and with them and we allow them to
float in the next tutorial I'll explain
how we can deal and how we can add some
spacing and some more formatting to make
this look a little bit better so if you
continue to watch we will dive a little
bit deeper to this