Design view and browser view in DW are different than when I view from local folder

Question

I'm brand new to Dreamweaver CS5.5 and here is my problem:
I've made an html page in dreamweaver with a banner, with an additional graphic and some text on top of the banner.  It displays just fine in every browser when I view from the local folder, but when I open DW and view, it displays incorrectly in all three design, live and browser views within DW.  If I make changes to the css file until it views correctly in design view, it no longer displays correctly from the local folder and it still doesn't view correctly in live or browser view within DW.  If what I'm doing isnt going to display accurately in any of the views provided by Dreamweaver as compared to the live server, whats the point in having this software?  I could just keep building webpages in notepad and uploading with CoreFTP.
Any suggestions?  Is it some setting that I dont know about that I need to change within DW?   Please help.

Answer 1

align="center" is deprecated (obsolete) code in XHTML & HTML5 doc types.  Instead of styling markup with HTML, you should be using CSS. 
CSS
.center {text-align:center}
HTML
<p class="center">some centered text here</p>
With respect to break tags, in XHTML doc types the correct syntax is <br /> not <br>.  However your usage of line breaks is inconsistent with good symantic markup.  Use headings <h1> <h2> <h3> <h4> for important keywords.  Use <p> for descriptive paragraphs.  Use <ul> <li> or <ol> <li> for lists.  Line breaks should be used minimally if ever.
XHTML doc types require all tags to be lowercase.  Uppercase tags will throw errors.
Your design is too rigid.  When text size is increased in browsers, your content is unreadable.  See screenshot.
SOLUTIONS:
1) DO NOT USE POSITION ABSOLUTE.  You don't need it.  Absolute positioning removes content from the normal document flow resulting in a jumbled mess.  Use default CSS positioning (none) with margins, padding & floats to align elements.
2) Remove HEIGHT values from all CSS containers.  Height limits a container's capacity to hold more content when needed.  Container height should always be determined by the amount of content it holds; not explicit values.  If required to reveal a background image, for example, use CSS min-height instead of height.
CSS Box Model
http://www.w3schools.com/css/css_boxmodel.asp
CSS Floats
http://www.w3schools.com/cssref/pr_class_float.asp
CSS min-height
http://www.w3schools.com/cssref/pr_dim_min-height.asp
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists 
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com/