Skip navigation
Currently Being Moderated

CSS, Design Mode vs Live Mode vs Missing Manual

Feb 19, 2013 1:22 AM

Hi,

 

I downloaded the trial version of DreamWeaver to see if I'd like to purchase it. To get a feeling for it, I've been using the CSS3 Missing Manual and doing the tutorials. Several times I've put code into DreamWeaver then clicked over to Live/Design Modes to see how it was coming along and what was supposed to happen wasn't visible BUT when I copy and past either the CSS or HTML into Coda, it comes out just as the book says it should. Any suggestions as to why?

 

I just tried to add text shaddow using the following which works in Coda but not DreamWeaver -- and it's really frustrating.

 

body{background-color:rgb(255,255,255);border: 3px solid rgb(75,75,75); box-shadow:0 0 15px 5px rgba(51,51,255,1);width:760px; margin-top:20px; margin-left:auto; margin-right:auto;padding:15px;}

 

 

Also, when I add CSS into my webpage in DW Live Mode will show it but Design Mode will not. Is that normal? What is the use of Design Mode vs Live Mode?

 

Thank you,

 

ct

 
Replies
  • Currently Being Moderated
    Feb 19, 2013 3:35 AM   in reply to iamwonderful

    Yes, the behavior that you see in Dreamweaver is the expected behavior. While the design view gives you a rough approximation of the visual representation of your code, it is the Live View that you should turn to for a preview of how your site will eventually appear in a browser.

     

    Thanks,

    Preran

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 19, 2013 8:06 AM   in reply to iamwonderful

    Can you preview your site in actual browsers and let us know what you get?

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 19, 2013 9:04 AM   in reply to iamwonderful

    I hate to say it but CS3 Missing Manual is sorely out of date for CS6.

     

    Are you working within a defined local site folder in DW?  Without this critical first step, DW cannot properly manage assets & links for you.

     

    Go to Site > Manage Sites > New...  for further details see the tutorial below.

    Creating  your first web site in DW

    http://www.adobe.com/devnet/dreamweaver/articles/first_website_pt1.htm l

     

    Design View is not 100% reliable.  Live View is built on the Webkit/Chrome engine so it is more like a real browser.  However, to test your work always use Preview in Browsers.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 19, 2013 2:53 PM   in reply to iamwonderful

    DW & Coda are two different products.  I don't use Coda and probably never will so I have no familiarity with how it works or what it does.

     

    All I can tell you is web technology is changing at break neck speed.  Many browsers have failed to keep up.  If you're using CSS3 properties, you often need to add vendor prefixes for the various browsers:

         -moz = Firefox,

         -webkit = Chrome/Safari,

         -o = Opera,

         -ms = IE9+

     

    Box-shadow code generator:

    http://css3gen.com/box-shadow/

     

    Design view is incapable of displaying CSS3 properties.  Live View is pretty good most of the time but it's not as comprehensive as the very latest browsers.  I keep Firefox open all the time so I can refresh browser to check my work.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    Feb 19, 2013 3:31 PM   in reply to iamwonderful

    I work in Split View with Live View.  This allows me to see the layout in one panel and edit code in the other.  

     

     

    Nancy O.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points