[HD] Website Drop Shadow with CSS Dreamweaver Tutorial!

April 4th, 2010 | by admin |

Let’s learn how to create a drop shadow that runs along your site, and, if your site expands, expands with it! We will start in Photoshop where we will create a nice little drop shadow graphic and then it’s off to Dreamweaver for some CSS and Div-tacular fun… yep that was certifiably lame, but enjoy the video anyway!

Be sure to check out http://www.tutvid.com
Check out the blog @ http://tutvid.wordpress.com

Duration : 0:10:0


[youtube cT1JAOB9XVI]

  1. 25 Responses to “[HD] Website Drop Shadow with CSS Dreamweaver Tutorial!”

  2. By MrMartivdz on Apr 4, 2010 | Reply

    @XclusiveMusik you …
    @XclusiveMusik you just have to delete the background then so you only see the shadow and the rest is transparant and then save for web and devices and then PNG-24 and make sure transparancy is checked. and then you have it! on your gradient.

  3. By MrCheneque on Apr 4, 2010 | Reply

    @inbornfilms the …
    @inbornfilms the same happens to me… donĀ“t know why…when I preview it works fine on Firefox and Chrome but it changes on IE

  4. By MrNuun on Apr 4, 2010 | Reply

    I Love you O_O <3 …
    I Love you O_O <3 You’re so amazing! Really good job. :)

  5. By Preeemo on Apr 4, 2010 | Reply

    great tutorial
    great tutorial

  6. By gregorygroupnet on Apr 4, 2010 | Reply

    tutvid, Another …
    tutvid, Another point to consider.

  7. By willzurmacht on Apr 4, 2010 | Reply

    Perfect! thank you …
    Perfect! thank you so much

  8. By ohgarden on Apr 4, 2010 | Reply

    I always learn so …
    I always learn so MUCH with the tutvid tutorials! THANK YOU!!! I hope to have my site up soon to share with you what I have learned!

  9. By ikristher on Apr 4, 2010 | Reply

    thanks men
    thanks men

  10. By inbornfilms on Apr 4, 2010 | Reply

    when i set left a …
    when i set left a right margin to auto it dosent change anything it worked once a while ago but not anymore… how do i fix this

  11. By piccolodick69 on Apr 4, 2010 | Reply

    Very useful, thanks …
    Very useful, thanks a lot man.

  12. By DaedalusIV on Apr 4, 2010 | Reply

    superb tutorial!
    superb tutorial!

  13. By double1912 on Apr 4, 2010 | Reply

    Thanks for the …
    Thanks for the tutorial.But there is only a small problem with it as it leaves a small gap each time dreamweaver repeat the picture.

  14. By khuram855 on Apr 4, 2010 | Reply

    Hello Please help …
    Hello Please help me when you open photoshop and create a new document i can see a dropshadow on photoshop white page like you didn’t have transparent background you have white and dropshadow on it so can i make for my photoshop to get dropshadow

  15. By momo1tm on Apr 4, 2010 | Reply

    cs4
    cs4

  16. By proverbs271 on Apr 4, 2010 | Reply

    DUDE! thankyou very …
    DUDE! thankyou very much for this guide! it was so helpfull!

    ty ^^

  17. By cmtmusik on Apr 4, 2010 | Reply

    Thank you!

    You …
    Thank you!

    You don’t lose time for speaking, that’s great!

  18. By pcgod8 on Apr 4, 2010 | Reply

    Yes, but you’ll …
    Yes, but you’ll need to save it as a PNG file and delete the background layer leaving a transparent background.

  19. By eternity899 on Apr 4, 2010 | Reply

    hmm since we’re …
    hmm since we’re talking efficiency u can simply leave the left most 20 pixels and the right most reducing the size of the shadow greatly since the rest isn’t visible anyway

  20. By titalminarisa on Apr 4, 2010 | Reply

    Nice work. keep it …
    Nice work. keep it up. mean time come for social media marketing for esteembpo**com

  21. By XclusiveMusik on Apr 4, 2010 | Reply

    thanks man rlly …
    thanks man rlly good tutorial… but can u also do this shadow effect if u have a gradient background ???

  22. By michaelandtristan on Apr 4, 2010 | Reply

    what version of …
    what version of dream weaver is that? cs3 or cs4?

  23. By gatikonice on Apr 4, 2010 | Reply

    Thanks, great stuff.
    Thanks, great stuff.

  24. By under9stars on Apr 4, 2010 | Reply

    Thank you! Thank …
    Thank you! Thank you! Thank you!

  25. By DrTadych on Apr 4, 2010 | Reply

    Thanks! great job!!
    Thanks! great job!!

  26. By akeu08 on Apr 4, 2010 | Reply

    as usual, great tut …
    as usual, great tut. Very fast but clear explanation for non English native :) Thanks man

Post a Comment