Dreamweaver Tutorial – Floating Div Tags in Dreamweaver cs4

July 14th, 2010 | by admin |



Twitter: www.twitter.com RSS www.dreamweavertutorial.co.uk In this Dreamweaver CS4 Tutorial from www.dreamweavertutorial.co.uk we will be floating div tag elements. Ill show you how to write the code, float the tags, and apply a clearing attribute to contain the floated elements. If you are not using a template and want to know how to create the clear float property in CSS then please visit my website. http

Technorati Tags: , , , , , , ,

  1. 25 Responses to “Dreamweaver Tutorial – Floating Div Tags in Dreamweaver cs4”

  2. By DreamWeaverTutorial on Mar 16, 2010 | Reply

    @falkon14 lol, im making another tutorial on floating this week end and should explain it a bit better for beginners. I hope..

  3. By DreamWeaverTutorial on Mar 16, 2010 | Reply

    @jaimito4285 thanks for the comments.

  4. By DreamWeaverTutorial on Mar 16, 2010 | Reply

    @Remiss63 thanks, I try!

  5. By DreamWeaverTutorial on Mar 16, 2010 | Reply

    @ainsleymg DIV TAGS! lol its a tutorial about floating div tags. I cannot avoid saying it.

  6. By lifeformlifeform on Mar 17, 2010 | Reply

    Excellent! Very appreciated! ;-) Keep it up! :-) Much easier to see these videos than read tons of pages…

  7. By lifeformlifeform on Mar 20, 2010 | Reply

    Maybe you know this:

    I want to design a 3 column design where the first colum to the right is supposed to stretch out its info over the second colum (which is lower / not so high).

    Column 1 is a profile column with basic contact info and profile description, where as Col 2 is the profile image (to the right) and then the Col 3 that should stretch through the whole height.

    Do you know how to code this? I have tried to set width: auto, but then it just stretches and pushes col 2 and 3 down.

  8. By lifeformlifeform on Mar 20, 2010 | Reply

    Hi again,

    Maybe you know this:

    I am designing a 3 column design, where I want the content of col 1 to expand underneath col 2 (which contains a profile image + some text underneath). Col 3 shall stretch down all through the site.

    Which width option would you use here?

    I have tried to set width:auto for col 1, but then it just blocks away col 2 and 3.

    Any idea on how to solve this?

  9. By lifeformlifeform on Mar 20, 2010 | Reply

    Hi again,

    Maybe you know this:

    I am designing a 3 column design, where I want the content of col 1 to expand underneath col 2 (which contains a profile image + some text underneath). Col 3 shall stretch down all through the site.

    Which width option would you use here? I have tried to set width:auto for col 1, but then it just block away col 2 and 3 horizontally.

    Any idea on how to solve this?

  10. By lifeformlifeform on Mar 20, 2010 | Reply

    Hi again,

    Maybe you know this:

    I am designing a 3 column design, where I want the content of col 1 to expand underneath col 2 (which contains a profile image + some text underneath). Col 3 shall stretch down all through the site.

    Which width option would you use here? I have tried to set width:auto for col 1, but then it just block away col 2 and 3 horizontally.

    Any idea on how to solve this?

  11. By 7thAttempt on Mar 21, 2010 | Reply

    Hi, err I may be missing something but as far as I understand; if you had to explicitly set css float properties for each advert div tag then why would the css property ie the float attribute affect the rest of the page? And then so why would you need to use a clearing tag ? I just thought the float property would only affect the id it’s assigned to ?

  12. By DreamWeaverTutorial on Mar 21, 2010 | Reply

    @7thAttempt because floating any element will take the element out of the document, its kind of like giving the div tag a hover board. so its floating in the air, then any div below it will slide up because it thinks the space is empty. that will keep happening to every element until you tell it to stop doing that. and the br class does that. put 3 divs in a wrapper div, float one right, one left and then try and position the 3rd underneath them. you wont be able to until you clear.

  13. By kirkivanbaesa on Apr 8, 2010 | Reply

    what program did you use for the title( 0:00 ~ 0:30 ) and credits ( 9:36 ~ 9:59 ) animations?

  14. By karmazon on Apr 10, 2010 | Reply

    With that voice you should get into hypnotism.

  15. By 02javis on Apr 10, 2010 | Reply

    Where can i find a tutorial, when the mouse hovers over an image and another larger image shows to the right or left of it?? (not a rollover)
    I’ll be checking your great tutorials, thanks.

  16. By DreamWeaverTutorial on Apr 10, 2010 | Reply

    @kirkivanbaesa I used after effects for that. takes me ages because im not very good at it.

  17. By DreamWeaverTutorial on Apr 10, 2010 | Reply

    @02javis you can do a disjointed rollover also known as a swap image. look in the behaviors panel under swap image behaviors.

  18. By 02javis on Apr 12, 2010 | Reply

    @DreamWeaverTutorial
    okthanks I will let u know..

  19. By ages777 on Apr 30, 2010 | Reply

    @DreamWeaverTutorial I’m trying to center my div tags by setting the right and lift margins to auto which works fine. But when I try to add another div layer on it, it doesn’t layer properly even with the right z-index number. The new layer just sits at the bottom of the previous layer.
    It’ll only layer properly (go on top) when I change the ‘position’ property to ‘Absolute’ which defeats the purpose of me trying to center my divs. What am I doing wrong?

  20. By DreamWeaverTutorial on Apr 30, 2010 | Reply

    @ages777 Im a bit confused. are you trying to put divs on top of divs? or inside of other divs? because if you want them on top of other divs they they would HAVE to be positioned absolute. you can ONLY use z-index with absolute divs and none other.

    If you go to my websites contact page and paste in the html and css ill take a look.

  21. By ages777 on Apr 30, 2010 | Reply

    @DreamWeaverTutorial I figured out the problem. The answer was nesting DIV’s inside each other to create a ‘centered layered effect’. My only problem now is how to adjust their ‘margin-top’ properties of the nested div. When I add a value to it (e.g 200px), it drags down the parent div along with it. How would I go about that?

    Thanks for all your help. I’ve found your videos extrememely helpful in my endeavor to learn HTML

  22. By TheAddictedGame on May 6, 2010 | Reply

    how did you add your own videos Eg not being from youtube?

  23. By TheKillerbeat on May 9, 2010 | Reply

    thanks, Finally managed the layout my site correctly :)

  24. By 02javis on May 13, 2010 | Reply

    @DreamWeaverTutorial
    I found it thanks!

  25. By themonster36 on May 18, 2010 | Reply

    is there a way to do this withouy messin with the codes?

  26. By coolkids374 on May 27, 2010 | Reply

    How did you make that website??????

Post a Comment