22 – Introduction to Dreamweaver Tutorial (CS6)

Setting up your div styles – part 2 In this Dreamweaver tutorial video you will see how to position your content area, right side bar area and the page foote…

Don’t forget to check out our other video tutorials or share this video with a friend.

0 votes

Loading... 2,884 views

15 responses to “22 – Introduction to Dreamweaver Tutorial (CS6)”

1. Veronica Peralta says:

   27/01/2015 at 7:31 pm

   I’m having a problem with the logo part and the social media, it doesn’t
   seem to go with the content. When I open it with my browser the logo and
   the social media, it did not include in the content area. What can I do
   with that?? Please help

   Thank you

   Reply
2. My views says:

   27/01/2015 at 7:35 pm

   my side bar hadding cant go on top it only change side from left to right !
   help
   #rightside { width:200px; float:right; }

   Reply
3. Paul Schuldt says:

   27/01/2015 at 8:34 pm

   At this point in the instruction, my page looks exactly as it should in the
   DESIGN view. However, in the live view or in any browser (I’ve tried
   Safari, Firefox and Google Chrome), the “rightside” div is not floated
   right and a couple of images appear to be broken. I’ve saved the project
   and refreshed the browsers several times and the result is always the same.
   Any reason that would be the case?

   Reply
4. Tamara Knowles says:

   27/01/2015 at 9:24 pm

   Thanks for the wonderful tutorials!! I am following them and loving them.
   they are so very helpful. I’m working on my ‘topnav’ area (my setup looks a
   little different, but that’s the area I’m working on). I am trying to get
   my top nav to look like this with the border above the individual words (
   http://www.wix.com/website-template/view/html/629?utm_content=ma_html_fwt_temp_17_4&utm_medium=template_banner&utm_campaign=ma_fwt&utm_source=freewebsitetemplates&experiment_id=ma_html_fwt_temp_17_4&utm_term=design)
   Do you have any suggestions on how I would do that? Thank you so much!

   Reply
5. bakurock2 says:

   27/01/2015 at 9:38 pm

   hello I was wondering if there was a way to make the wrapper be
   transparent? that way you would be able to see the background image ?

   Reply
6. Bernārs Kažoks says:

   27/01/2015 at 10:17 pm

   Thank you really much!!

   Reply
7. Sean Campbell says:

   27/01/2015 at 10:34 pm

   Lol i fixed my issue by changing the float:left to 480px instead of 580px
   and everything lined up perfectly. and to think i restarted the whole
   tutorial months later just to change one digit lol awesome tuts thank you
   for all you’ve done 

   Reply
8. dmarsh1990 says:

   27/01/2015 at 10:37 pm

   May God Bless you Timothy Kywn. 

   Reply
9. Teri Smith says:

   27/01/2015 at 11:24 pm

   I’ve been using your tutorials and they are great!! However, I can’t figure
   out what I’ve done. My right side bar area is way over to the right and its
   a little shorter then the main content area.

   Reply
10. DC says:

    28/01/2015 at 12:03 am

    went over everything for an entire week and I am officially stuck please
    help!!My wrapper is not extending to the bottom of the page and some of my
    boxes, images and text look off

    Reply
11. Fatih Kocer says:

    28/01/2015 at 12:50 am

    Why do you have box2 floated to the left? We could have it floated to the
    right as well. Correct? Because it will be bounded by the content div. And
    we would not worry about the margin.

    Reply
12. Felipe Marelli says:

    28/01/2015 at 1:03 am

    “I have followed your instructions step by step, but for some reason after
    I set the #content and #rightside to float: left, my wrapper does not
    extend past the banner image. I set the footer to clear:both in hopes it
    would fix the problem like it did on your page but the wrapper still will
    not extend past the banner image. Because of this, I cannot keep up with
    you for the next steps because the images such as box 1 and box 2 do not
    line up correctly. Any Suggestions? Thanks in advance.”

    I had the same problem, just add a div called “problem” and put the
    content, rightside and footer divs in. Then in the styleshit add:
    #footer {clear:both; }
    #problem { width:900px ; margin:10px auto; background-color:#fff; }

    Reply
13. iammJOSHUA says:

    28/01/2015 at 1:23 am

    no width is not including margin, but does include the padding. For,
    #example{width:500px; padding:0 50px; margin:0 50px;} the width would
    actually be 600px, but the usable area would be 400px. Hope that helps.

    Reply
14. Abhishek Bhoir says:

    28/01/2015 at 2:08 am

    same problem……..plz help & explain …..

    Reply
15. Joshua Kywn says:

    28/01/2015 at 2:22 am

    Can’t really tell base on your description but this is the code we use.
    #content { width:650px; float:left; } #rightside { width:200px;
    float:right; }

    Reply