CS4 and CS6 design views

Report · Aug 06, 2012

When viewing the same index file I see significant differences between the design views of Dreamweaver CS4 and Dreamweaver CS6. The index file was created in CS5. My CS4 displays it correctly while CS6 design view is not even close. The live views are correct with both.

Report · Aug 06, 2012

Yeah, they'll be different. There are things that DW6 knows that weren't invented when DW4 was out and other things that DW4 will still see that have been completely removed from HTML and are either ignored, or not rendered correctly by DW6.

Do you have a specific question about something you're seeing?

Report · Aug 06, 2012

It almost appears that the interpretation of the css is being handled differently between the two versions. I don't know how that would be when both versions display the live view and browser output correctly.

Report · Aug 06, 2012

What exactly are you seeing as the differences? There have been quite a few instances where some reset styling has been causing a design to look different from previous DW versions due to CS6 being stricter, as Murray mentioned.

Could you post the code or link to live page?

Report · Aug 06, 2012

Rik, Almost spot on with that suggestion to remove the reset code from the css. That corrected all but one heading centering issue while in design view. Any idea why that code only effects the design view and not the live view or browser output. Is reset code still commonly used? I have heard both pros and cons. I have not used the forums very much and when you mentioned posting the code or live page are you referring to a spot that Adobe has setup? Right now the file is only on my testing server, not live.

Report · Aug 06, 2012

Without seeing your code (both HTML and CSS) it would be hard to answer this. The best way to show us would be to post a link to the live pages.

Report · Aug 06, 2012

You are able to post the code in your reply go to code view, select all, copy and then paste in here. Alternatively, you could use the "advanced editor" view and paste inside "syntax highlighting" but that gets tricky.

Your header might have moved because it was relying on something from the reset style. It should be easily fixed when the code is seen. As for the resets themselves, people have different views on this but I find they cause more issues than they are worth. They can be good as guidance on what you can include in your stylesheet though. I tend to write my CSS more or less from scratch and add my own reset into it - that way I know exactly what I am resetting!

Report · Aug 06, 2012

Here is the original .php doc. (Does not contain any php because that was the exercise to insert it).

<!DOCTYPE html>

<head>

<title>Explore California</title>

</head>

</div>

<h1>Heading</h1>

</div>

</div>

<li><a href="http://www.explorecalifornia.org/tours.htm" title="Explore our tours" class="tours">Tours</a></li>

<li><a href="http://www.exlorecalifornia.org/mission.htm" title="What we think" class="mission">Mission</a></li>

<li><a href="http://www.explorecalifornia.org/contact.htm" title="Contact and support" class="contact">Contact</a></li>

<li><a href="http://www.explorecalifornia.org/resources.htm" title="Guidance and planning" class="resources">Resources</a></li>

<li><a href="http://www.explorecalifornia.org/explorers.htm" title="Join our community" class="explorers current">Explorers</a></li>

</ul>

<!--<ul class="xoxo">

<div><label class="screen-reader-text" for="s">Search for:</label>

</div>

</form></li> <li id="recent-posts-2" class="widget-container widget_recent_entries"> <h3 class="widget-title">Recent Posts</h3> <ul>

<li><a href="http://localhost/explore_ca/?p=4" title="Mountain Biking Rules">Mountain Biking Rules</a></li>

<li><a href="http://localhost/explore_ca/?p=1" title="Hello world!">Hello world!</a></li>

</ul>

</li><li id="archives-2" class="widget-container widget_archive"><h3 class="widget-title">Archives</h3> <select name="archive-dropdown" onchange="document.location.href=this.options[this.selectedIndex].value;"> <option value="">Select Month</option> <option value="http://localhost/explore_ca/?m=201008"> August 2010 </option>

</select>

</li><li id="categories-2" class="widget-container widget_categories"><h3 class="widget-title">Categories</h3> <ul>

<li class="cat-item cat-item-1"><a href="http://localhost/explore_ca/?cat=1" title="View all posts filed under Uncategorized">Uncategorized</a>

</li>

</ul>

</li> </ul>-->

</div>

</div>

<h3>Quick Nav</h3>

<li><a href="../tours.htm" title="Explore our tours">Tours</a></li>

<li><a href="../mission.htm" title="What we think">Mission</a></li>

<li><a href="../contact.htm" title="Contact and support">Contact</a></li>

<li><a href="../resources.htm" title="Guidance and planning">Resources</a></li>

<li><a href="../explorers.htm" title="Join our community">Explorers</a></li>

</ul>

</div>

<p>Find out more about our tours</p>

<h3><a href="../contact/support.htm">Support</a></h3>

<p>Need help? It's just a click away!</p>

<h3><a href="../resources/legal.htm">Legal Disclaimer</a></h3>

</div>

<h1>Explore California</h1>

<p>5605 Nota Street<br />

Ventura, CA 93003</p>

</div>

</p>

</div>

</div>

</body>

</html>

And here is the related css with reset code

/*

Theme Name: Explore California

Theme URI: http://explorecalifornia.org/

Description: A new theme.

Author: Joe Lowery for Lynda.com

Version: 1.0

Tags: Western

*/

/* =Reset default browser CSS. Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html

-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {

background: transparent;

border: 0;

margin: 0;

padding: 0;

vertical-align: baseline;

}

body {

line-height: 1;

}

h1, h2, h3, h4, h5, h6 {

clear: both;

font-weight: normal;

}

ol, ul {

list-style: none;

}

blockquote {

quotes: none;

}

blockquote:before, blockquote:after {

content: '';

content: none;

}

del {

text-decoration: line-through;

}

/* tables still need 'cellspacing="0"' in the markup */

table {

border-collapse: collapse;

border-spacing: 0;

}

a img {

border: none;

}

/* =Layout

-------------------------------------------------------------- */

/*

LAYOUT: Two columns

DESCRIPTION: Two-column fixed layout with one sidebar right of content

*/

#container {

float: right;

margin: 0 -260px 0 0;

width: 100%;

}

#content {

margin: 0 280px 0 20px;

}

#primary,

#secondary {

float: left;

overflow: hidden;

width: 250px;

}

#secondary {

clear: right;

}

#footer {

clear: both;

width: 100%;

}

/*

LAYOUT: One column, no sidebar

DESCRIPTION: One centered column with no sidebar

*/

.one-column #content {

margin: 0 auto;

width: 640px;

}

/*

LAYOUT: Full width, no sidebar

DESCRIPTION: Full width content with no sidebar; used for attachment pages

*/

.single-attachment #content {

margin: 0 auto;

width: 900px;

}

/* =Fonts

-------------------------------------------------------------- */

body,

input,

textarea,

.page-title span,

.pingback a.url {

font-family: Georgia, "Bitstream Charter", serif;

}

h3#comments-title,

h3#reply-title,

#access .menu,

#access div.menu ul,

#cancel-comment-reply-link,

.form-allowed-tags,

#site-info,

#site-title,

#wp-calendar,

.comment-meta,

.comment-body tr th,

.comment-body thead th,

.entry-content label,

.entry-content tr th,

.entry-content thead th,

.entry-meta,

.entry-title,

.entry-utility,

#respond label,

.navigation,

.page-title,

.pingback p,

.reply,

.widget-title,

.wp-caption-text,

input[type=submit] {

font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;

}

pre {

font-family: "Courier 10 Pitch", Courier, monospace;

}

code {

font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;

}

/* =Structure

-------------------------------------------------------------- */

/* The main theme structure */

#access .menu-header,

div.menu,

#colophon,

#branding,

#main,

#wrapper {

margin: 0 auto;

width: 930px;

}

#wrapper {

background: #fff;

margin-top: 25px;

padding: 0;

}

/* Structure the footer area */

#footer-widget-area {

overflow: hidden;

}

#footer-widget-area .widget-area {

float: left;

margin-right: 20px;

width: 220px;

}

#footer-widget-area #fourth {

margin-right: 0;

}

#site-info {

float: left;

font-size: 14px;

font-weight: bold;

width: 700px;

}

#site-generator {

float: right;

width: 220px;

}

/* =Global Elements

-------------------------------------------------------------- */

/* Main global 'theme' and typographic styles */

body {

background: #e1d8b9 url(images/page_background.jpg) repeat-x left top;

}

body,

input,

textarea {

color: #666;

font-size: 12px;

line-height: 18px;

}

hr {

background-color: #e7e7e7;

border: 0;

clear: both;

height: 1px;

margin-bottom: 18px;

}

/* Text elements */

p {

margin-bottom: 18px;

}

ul {

list-style: square;

margin: 0 0 18px 1.5em;

}

ol {

list-style: decimal;

margin: 0 0 18px 1.5em;

}

ol ol {

list-style: upper-alpha;

}

ol ol ol {

list-style: lower-roman;

}

ol ol ol ol {

list-style: lower-alpha;

}

ul ul,

ol ol,

ul ol,

ol ul {

margin-bottom: 0;

}

dl {

margin: 0 0 24px 0;

}

dt {

font-weight: bold;

}

dd {

margin-bottom: 18px;

}

strong {

font-weight: bold;

}

cite,

em,

i {

font-style: italic;

}

big {

font-size: 131.25%;

}

ins {

background: #ffc;

text-decoration: none;

}

blockquote {

font-style: italic;

padding: 0 3em;

}

blockquote cite,

blockquote em,

blockquote i {

font-style: normal;

}

pre {

background: #f7f7f7;

color: #222;

line-height: 18px;

margin-bottom: 18px;

padding: 1.5em;

}

abbr,

acronym {

border-bottom: 1px dotted #666;

cursor: help;

}

sup,

sub {

height: 0;

line-height: 1;

position: relative;

vertical-align: baseline;

}

sup {

bottom: 1ex;

}

sub {

top: .5ex;

}

input[type="text"],

textarea {

background: #f9f9f9;

border: 1px solid #ccc;

box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);

-moz-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);

-webkit-box-shadow: inset 1px 1px 1px rgba(0,0,0,0.1);

padding: 2px;

}

a:link {

color: #0066cc;

}

a:visited {

color: #743399;

}

a:active,

a:hover {

color: #ff4b33;

}

/* Text meant only for screen readers */

.screen-reader-text {

position: absolute;

left: -9000px;

}

/* =Header

-------------------------------------------------------------- */

#header {

padding: 30px 0 0;

background: url(images/blog_banner.jpg) no-repeat;

height: 187px;

position: relative;

}

#masthead {

position: absolute;

left: 42px;

top: -20px;

}

#site-title {

float: left;

font-size: 30px;

line-height: 36px;

margin: 0 0 18px 0;

width: 700px;

}

#site-title a {

color: #000;

font-weight: bold;

text-decoration: none;

}

#site-description {

clear: right;

float: right;

font-style: italic;

margin: 14px 0 18px 0;

width: 220px;

}

/* This is the custom header image */

#branding img {

border-top: 4px solid #000;

border-bottom: 1px solid #000;

clear: both;

display: block;

}

/* =Menu

-------------------------------------------------------------- */

#access {

background: #000;

display: block;

float: left;

margin: 0 auto;

width: 940px;

}

#access .menu-header,

div.menu {

font-size: 13px;

margin-left: 12px;

width: 928px;

}

#access .menu-header ul,

div.menu ul {

list-style: none;

margin: 0;

}

#access .menu-header li,

div.menu li {

float: left;

position: relative;

}

#access a {

color: #aaa;

display: block;

line-height: 38px;

padding: 0 10px;

text-decoration: none;

}

#access ul ul {

box-shadow: 0px 3px 3px rgba(0,0,0,0.2);

-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);

-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);

display: none;

position: absolute;

top: 38px;

left: 0;

float: left;

width: 180px;

z-index: 99999;

}

#access ul ul li {

min-width: 180px;

}

#access ul ul ul {

left: 100%;

top: 0;

}

#access ul ul a {

background: #333;

line-height: 1em;

padding: 10px;

width: 160px;

height: auto;

}

#access li:hover > a,

#access ul ul :hover > a {

background: #333;

color: #fff;

}

#access ul li:hover > ul {

display: block;

}

#access ul li.current_page_item > a,

#access ul li.current-menu-ancestor > a,

#access ul li.current-menu-item > a,

#access ul li.current-menu-parent > a {

color: #fff;

}

* html #access ul li.current_page_item a,

* html #access ul li.current-menu-ancestor a,

* html #access ul li.current-menu-item a,

* html #access ul li.current-menu-parent a,

* html #access ul li a:hover {

color: #fff;

}

/* =Content

-------------------------------------------------------------- */

#main {

clear: both;

overflow: hidden;

padding: 40px 0 0 0;

}

#content {

margin-bottom: 36px;

}

#content,

#content input,

#content textarea {

color: #333;

font-size: 16px;

line-height: 24px;

}

#content p,

#content ul,

#content ol,

#content dd,

#content pre,

#content hr {

margin-bottom: 24px;

}

#content ul ul,

#content ol ol,

#content ul ol,

#content ol ul {

margin-bottom: 0;

}

#content pre,

#content kbd,

#content tt,

#content var {

font-size: 15px;

line-height: 21px;

}

#content code {

font-size: 13px;

}

#content dt,

#content th {

color: #000;

}

#content h1,

#content h2,

#content h3,

#content h4,

#content h5,

#content h6 {

color: #000;

line-height: 1.5em;

margin: 0 0 20px 0;

}

#content table {

border: 1px solid #e7e7e7;

margin: 0 -1px 24px 0;

text-align: left;

width: 100%;

}

#content tr th,

#content thead th {

color: #888;

font-size: 12px;

font-weight: bold;

line-height: 18px;

padding: 9px 24px;

}

#content tr td {

border-top: 1px solid #e7e7e7;

padding: 6px 24px;

}

#content tr.odd td {

background: #f2f7fc;

}

.hentry {

margin: 0 0 48px 0;

}

.home .sticky {

background: #f2f7fc;

border-top: 4px solid #000;

margin-left: -20px;

margin-right: -20px;

padding: 18px 20px;

}

.single .hentry {

margin: 0 0 36px 0;

}

.page-title {

color: #000;

font-size: 14px;

font-weight: bold;

margin: 0 0 36px 0;

}

.page-title span {

color: #333;

font-size: 16px;

font-style: italic;

font-weight: normal;

}

.page-title a:link,

.page-title a:visited {

color: #888;

text-decoration: none;

}

.page-title a:active,

.page-title a:hover {

color: #ff4b33;

}

#content .entry-title {

color: #000;

font-size: 21px;

font-weight: bold;

line-height: 1.3em;

margin-bottom: 0;

}

.entry-title a:link,

.entry-title a:visited {

color: #000;

text-decoration: none;

}

.entry-title a:active,

.entry-title a:hover {

color: #ff4b33;

}

.entry-meta {

color: #888;

font-size: 12px;

}

.entry-meta abbr,

.entry-utility abbr {

border: none;

}

.entry-meta abbr:hover,

.entry-utility abbr:hover {

border-bottom: 1px dotted #666;

}

.entry-content,

.entry-summary {

clear: both;

padding: 12px 0 0 0;

}

#content .entry-summary p:last-child {

margin-bottom: 12px;

}

.entry-content fieldset {

border: 1px solid #e7e7e7;

margin: 0 0 24px 0;

padding: 24px;

}

.entry-content fieldset legend {

background: #fff;

color: #000;

font-weight: bold;

padding: 0 24px;

}

.entry-content input {

margin: 0 0 24px 0;

}

.entry-content input.file,

.entry-content input.button {

margin-right: 24px;

}

.entry-content label {

color: #888;

font-size: 12px;

}

.entry-content select {

margin: 0 0 24px 0;

}

.entry-content sup,

.entry-content sub {

font-size: 10px;

}

.entry-content blockquote.left {

float: left;

margin-left: 0;

margin-right: 24px;

text-align: right;

width: 33%;

}

.entry-content blockquote.right {

float: right;

margin-left: 24px;

margin-right: 0;

text-align: left;

width: 33%;

}

.page-link {

color: #000;

font-weight: bold;

margin: 0 0 22px 0;

word-spacing: 0.5em;

}

.page-link a:link,

.page-link a:visited {

background: #f1f1f1;

color: #333;

font-weight: normal;

padding: 0.5em 0.75em;

text-decoration: none;

}

.home .sticky .page-link a {

background: #d9e8f7;

}

.page-link a:active,

.page-link a:hover {

color: #ff4b33;

}

body.page .edit-link {

clear: both;

display: block;

}

#entry-author-info {

background: #f2f7fc;

border-top: 4px solid #000;

clear: both;

font-size: 14px;

line-height: 20px;

margin: 24px 0;

overflow: hidden;

padding: 18px 20px;

}

#entry-author-info #author-avatar {

background: #fff;

border: 1px solid #e7e7e7;

float: left;

height: 60px;

margin: 0 -104px 0 0;

padding: 11px;

}

#entry-author-info #author-description {

float: left;

margin: 0 0 0 104px;

}

#entry-author-info h2 {

color: #000;

font-size: 100%;

font-weight: bold;

margin-bottom: 0;

}

.entry-utility {

clear: both;

color: #888;

font-size: 12px;

line-height: 18px;

}

.entry-meta a,

.entry-utility a {

color: #888;

}

.entry-meta a:hover,

.entry-utility a:hover {

color: #ff4b33;

}

#content .video-player {

padding: 0;

}

/* =Asides

-------------------------------------------------------------- */

.home #content .category-asides p {

font-size: 14px;

line-height: 20px;

margin-bottom: 10px;

margin-top: 0;

}

.home .hentry.category-asides {

padding: 0;

}

.home #content .category-asides .entry-content {

padding-top: 0;

}

/* =Gallery listing

-------------------------------------------------------------- */

.category-gallery .size-thumbnail img {

border: 10px solid #f1f1f1;

margin-bottom: 0;

}

.category-gallery .gallery-thumb {

float: left;

margin-right: 20px;

margin-top: -4px;

}

.home #content .category-gallery .entry-utility {

padding-top: 4px;

}

/* =Attachment pages

-------------------------------------------------------------- */

.attachment .entry-content .entry-caption {

font-size: 140%;

margin-top: 24px;

}

.attachment .entry-content .nav-previous a:before {

content: '\2190\00a0';

}

.attachment .entry-content .nav-next a:after {

content: '\00a0\2192';

}

/* =Images

-------------------------------------------------------------- */

#content img {

margin: 0;

height: auto;

max-width: 640px;

width: auto;

}

#content .attachment img {

max-width: 900px;

}

#content .alignleft,

#content img.alignleft {

display: inline;

float: left;

margin-right: 24px;

margin-top: 4px;

}

#content .alignright,

#content img.alignright {

display: inline;

float: right;

margin-left: 24px;

margin-top: 4px;

}

#content .aligncenter,

#content img.aligncenter {

clear: both;

display: block;

margin-left: auto;

margin-right: auto;

}

#content img.alignleft,

#content img.alignright,

#content img.aligncenter {

margin-bottom: 12px;

}

#content .wp-caption {

background: #f1f1f1;

line-height: 18px;

margin-bottom: 20px;

padding: 4px;

text-align: center;

}

#content .wp-caption img {

margin: 5px 5px 0;

}

#content .wp-caption p.wp-caption-text {

color: #888;

font-size: 12px;

margin: 5px;

}

#content .wp-smiley {

margin: 0;

}

#content .gallery {

margin: 0 auto 18px;

}

#content .gallery .gallery-item {

float: left;

margin-top: 0;

text-align: center;

width: 33%;

}

#content .gallery img {

border: 2px solid #cfcfcf;

}

#content .gallery .gallery-caption {

color: #888;

font-size: 12px;

margin: 0 0 12px;

}

#content .gallery dl {

margin: 0;

}

#content .gallery img {

border: 10px solid #f1f1f1;

}

#content .gallery br+br {

display: none;

}

#content .attachment img { /* single attachment images should be centered */

display: block;

margin: 0 auto;

}

/* =Navigation

-------------------------------------------------------------- */

.navigation {

color: #888;

font-size: 12px;

line-height: 18px;

overflow: hidden;

}

.navigation a:link,

.navigation a:visited {

color: #888;

text-decoration: none;

}

.navigation a:active,

.navigation a:hover {

color: #ff4b33;

}

.nav-previous {

float: left;

width: 50%;

}

.nav-next {

float: right;

text-align: right;

width: 50%;

}

#nav-above {

margin: 0 0 18px 0;

}

#nav-above {

display: none;

}

.paged #nav-above,

.single #nav-above {

display: block;

}

#nav-below {

margin: -18px 0 0 0;

}

/* =Comments

-------------------------------------------------------------- */

#comments {

clear: both;

}

#comments .navigation {

padding: 0 0 18px 0;

}

h3#comments-title,

h3#reply-title {

color: #000;

font-size: 20px;

font-weight: bold;

margin-bottom: 0;

}

h3#comments-title {

padding: 24px 0;

}

.commentlist {

list-style: none;

margin: 0;

}

.commentlist li.comment {

border-bottom: 1px solid #e7e7e7;

line-height: 24px;

margin: 0 0 24px 0;

padding: 0 0 0 56px;

position: relative;

}

.commentlist li:last-child {

border-bottom: none;

margin-bottom: 0;

}

#comments .comment-body ul,

#comments .comment-body ol {

margin-bottom: 18px;

}

#comments .comment-body p:last-child {

margin-bottom: 6px;

}

#comments .comment-body blockquote p:last-child {

margin-bottom: 24px;

}

.commentlist ol {

list-style: decimal;

}

.commentlist .avatar {

position: absolute;

top: 4px;

left: 0;

}

.comment-author {

}

.comment-author cite {

color: #000;

font-style: normal;

font-weight: bold;

}

.comment-author .says {

font-style: italic;

}

.comment-meta {

font-size: 12px;

margin: 0 0 18px 0;

}

.comment-meta a:link,

.comment-meta a:visited {

color: #888;

text-decoration: none;

}

.comment-meta a:active,

.comment-meta a:hover {

color: #ff4b33;

}

.commentlist .even {

}

.commentlist .bypostauthor {

}

.reply {

font-size: 12px;

padding: 0 0 24px 0;

}

.reply a,

a.comment-edit-link {

color: #888;

}

.reply a:hover,

a.comment-edit-link:hover {

color: #ff4b33;

}

.commentlist .children {

list-style: none;

margin: 0;

}

.commentlist .children li {

border: none;

margin: 0;

}

.nopassword,

.nocomments {

display: none;

}

#comments .pingback {

border-bottom: 1px solid #e7e7e7;

margin-bottom: 18px;

padding-bottom: 18px;

}

.commentlist li.comment+li.pingback {

margin-top: -6px;

}

#comments .pingback p {

color: #888;

display: block;

font-size: 12px;

line-height: 18px;

margin: 0;

}

#comments .pingback .url {

font-size: 13px;

font-style: italic;

}

/* Comments form */

input[type=submit] {

color: #333;

}

#respond {

border-top: 1px solid #e7e7e7;

margin: 24px 0;

overflow: hidden;

position: relative;

}

#respond p {

margin: 0;

}

#respond .comment-notes {

margin-bottom: 1em;

}

.form-allowed-tags {

line-height: 1em;

}

.children #respond {

margin: 0 48px 0 0;

}

h3#reply-title {

margin: 18px 0;

}

#comments-list #respond {

margin: 0 0 18px 0;

}

#comments-list ul #respond {

margin: 0;

}

#cancel-comment-reply-link {

font-size: 12px;

font-weight: normal;

line-height: 18px;

}

#respond .required {

color: #ff4b33;

font-weight: bold;

}

#respond label {

color: #888;

font-size: 12px;

}

#respond input {

margin: 0 0 9px;

width: 98%;

}

#respond textarea {

width: 98%;

}

#respond .form-allowed-tags {

color: #888;

font-size: 12px;

line-height: 18px;

}

#respond .form-allowed-tags code {

font-size: 11px;

}

#respond .form-submit {

margin: 12px 0;

}

#respond .form-submit input {

font-size: 14px;

width: auto;

}

/* =Widget Areas

-------------------------------------------------------------- */

.widget-area ul {

list-style: none;

margin-left: 0;

}

.widget-area ul ul {

list-style: square;

margin-left: 1.3em;

}

.widget_search #s {/* This keeps the search inputs in line */

width: 60%;

}

.widget_search label {

display: none;

}

.widget-container {

margin: 0 0 18px 45px;

}

.widget-title {

color: #3B6B91;

font-weight: bold;

}

.widget-area a:link,

.widget-area a:visited {

text-decoration: none;

}

.widget-area a:active,

.widget-area a:hover {

text-decoration: underline;

}

.widget-area .entry-meta {

font-size: 11px;

}

#wp_tag_cloud div {

line-height: 1.6em;

}

#wp-calendar {

width: 100%;

}

#wp-calendar caption {

color: #222;

font-size: 14px;

font-weight: bold;

padding-bottom: 4px;

text-align: left;

}

#wp-calendar thead {

font-size: 11px;

}

#wp-calendar thead th {

}

#wp-calendar tbody {

color: #aaa;

}

#wp-calendar tbody td {

background: #f5f5f5;

border: 1px solid #fff;

padding: 3px 0 2px;

text-align: center;

}

#wp-calendar tbody .pad {

background: none;

}

#wp-calendar tfoot #next {

text-align: right;

}

.widget_rss a.rsswidget {

color: #000;

}

.widget_rss a.rsswidget:hover {

color: #ff4b33;

}

.widget_rss .widget-title img {

width: 11px;

height: 11px;

}

/* Main sidebars */

#main .widget-area ul {

margin-left: 0;

padding: 0 20px 0 0;

}

#main .widget-area ul ul {

border: none;

margin-left: 1.3em;

padding: 0;

}

#primary {

}

#secondary {

}

/* Footer widget areas */

#footer-widget-area {

}

/* =Footer

-------------------------------------------------------------- */

#footer {

margin-bottom: 20px;

background: url(images/footer_back.gif) no-repeat center top;

height: 600px;

}

#colophon {

overflow: hidden;

padding: 45px 0;

font-weight: bold;

color: #FFF;

text-align: center;

}

#site-info {

font-weight: bold;

}

#site-info a {

color: #000;

text-decoration: none;

}

#site-generator {

font-style: italic;

position: relative;

}

#site-generator a {

background: url(images/wordpress.png) center left no-repeat;

color: #666;

display: inline-block;

line-height: 16px;

padding-left: 20px;

text-decoration: none;

}

#site-generator a:hover {

text-decoration: underline;

}

img#wpstats {

display: block;

margin: 0 auto 10px;

}

/* =Mobile Safari ( iPad, iPhone and iPod Touch )

-------------------------------------------------------------- */

pre {

-webkit-text-size-adjust: 140%;

}

code {

-webkit-text-size-adjust: 160%;

}

#access,

.entry-meta,

.entry-utility,

.navigation,

.widget-area {

-webkit-text-size-adjust: 120%;

}

#site-description {

-webkit-text-size-adjust: none;

}

/* =Print Style

-------------------------------------------------------------- */

@media print {

body {

background: none !important;

}

#wrapper {

clear: both !important;

display: block !important;

float: none !important;

position: relative !important;

}

#header {

border-bottom: 2pt solid #000;

padding-bottom: 18pt;

}

#colophon {

border-top: 2pt solid #000;

}

#site-title,

#site-description {

float: none;

line-height: 1.4em;

margin: 0;

padding: 0;

}

#site-title {

font-size: 13pt;

}

.entry-content {

font-size: 14pt;

line-height: 1.6em;

}

.entry-title {

font-size: 21pt;

}

#access,

#branding img,

#respond,

.comment-edit-link,

.edit-link,

.navigation,

.page-link,

.widget-area {

display: none !important;

}

#container,

#header,

#footer {

margin: 0;

width: 100%;

}

#content,

.one-column #content {

margin: 24pt 0 0;

width: 100%;

}

.wp-caption p {

font-size: 11pt;

}

#site-info,

#site-generator {

float: none;

width: auto;

}

#colophon {

width: auto;

}

img#wpstats {

display: none;

}

#site-generator a {

margin: 0;

padding: 0;

}

#entry-author-info {

border: 1px solid #e7e7e7;

}

#main {

display: inline;

}

.home .sticky {

border: none;

}

/* -------- sidebar region --------*/

#sidebar .sidebarContent {

padding-left: 45px;

}

/* base navigation */

ul#baseNav {

float: left;

list-style: none;

margin:0;

padding:0;

margin-bottom: 30px;

}

ul#baseNav li {

margin: 0;

padding: 0;

}

ul#baseNav li a{

display: block;

width: 272px;

height: 70px;

text-indent: -1000em;

}

ul#baseNav li a.tours {

background: url(images/tours_main.gif) no-repeat left top;

}

ul#baseNav li a.mission{

background: url(images/mission_main.gif) no-repeat left top;

}

ul#baseNav li a.contact {

background: url(images/contact_main.gif) no-repeat left top;

}

ul#baseNav li a.resources {

background: url(images/resource_main.gif) no-repeat left top;

}

ul#baseNav li a.explorers {

background: url(images/explorers_main.gif) no-repeat left top;

}

ul#baseNav li a.current, ul#baseNav li a.current:hover {

background-position: right top;

border: none;

cursor: default;

}

ul#baseNav li a:hover {

background-position: -272px 0;

border: none;

}

/* ------- footer region ------- */

#footer h1 {

padding: 0;

}

#footer h3 {

font: normal 1.3em Arial, Helvetica, sans-serif;

color: #fff;

margin-bottom: 0.5em;

letter-spacing: 0.1em;

margin-top: 0px;

}

#footer p{

font: normal 1em Georgia, "Times New Roman", Times, serif;

color: #fff;

}

#footer p.support {

font-size: 0.8em;

text-align: center;

padding-top: 250px;

}

#footer p.support a{

color: #147;

}

#footer p.support a:hover{

color: #147;

border-bottom: 1px dashed #147;

text-decoration:none;

}

#footer ul#quickNav {

list-style: none;

margin: 0;

padding: 0;

}

#footer ul#quickNav li {

margin: 0 0 .5em 0;

padding: 0 ;

}

#footer ul#quickNav li a{

text-decoration: none;

color: #fff;

font-size: 1em;

font-family: Georgia, "Times New Roman", Times, serif;

}

#footer ul#quickNav li a:hover {

color: #193742;

border-bottom-color: #193742;

}

#footer #footerMenu {

float: left;

width: 230px;

}

#footer #footerBody {

float: right;

width: 540px;

}

#footer #footerBody a {

text-decoration: none;

color: #fff;

}

#footer #footerBody a:hover {

color: #193742;

border-bottom-color: #193742;

}

#footer #footerBody #footerMidCol {

float: left;

width: 270px;

}

#footer #footerBody #footerMidCol p {

margin-bottom: 2em;

}

#footer #footerBody #footerRightCol {

float: right;

width: 270px;

}

#footer #footerBody #footerRightCol h1{

font: bold 1.6em Georgia, "Times New Roman", Times, serif;

color: #fff;

letter-spacing:.1em;

text-align:right;

margin-bottom: .25em;

}

#footer #footerBody #footerRightCol p{

color: #fff;

letter-spacing:.1em;

line-height: 1.2;

text-align:right;

margin-bottom: 1em;

}

#footer #footerBody #footerRightCol p.phone{

font: bold 1.6em Georgia, "Times New Roman", Times, serif;

color: #fff;

letter-spacing:.1em;

}

/* Page template rules */

#templateID h1 {

text-align: center;

font: 4em "Trebuchet MS", Arial, Helvetica, sans-serif;

}

#footer #footerContent {

padding: 45px 30px 0px;

overflow: hidden;

}

Report · Aug 06, 2012

Don't suppose you have a link to the live page, do you?

Report · Aug 06, 2012

I wouldn't have the temerity to suggest that Joe Lowery could write invalid HTML or CSS! Luckily both HTML and CSS validate (nominally).

And for what it's worth I agree with Rik about the resets. I rarely (if ever) use them.

Can you explain what you are seeing with regard to the heading centering issue in the two versions of DW?

Report · Aug 06, 2012

The positioning issue was with the h1 head in div#content. rather than being centered on the it looks positioned to the right. If by chance you have access to Lynda.com the file is used in 'Dreamweaver and WordPress Core Concepts series, chapter 5 lesson one. I have to run a errand and will be away from my station for awhile. I want to thank all for the input, its much appreciated.

Report · Aug 07, 2012

EEEK! whenever I see anything which Eric Meyers is involved in I'm not surprised it doesn't work. I dunno what the guy is doing now, probably playing his banjo (I believe he was in some kind of country band). He only ever produced css which was way ahead of what any current browser could interpret let alone a software program. Enough said. Personally I'd try to learn css yourself and not rely on other peoples interpretation of how to write it. There is more than one way to skin a cat and the more advanced the css the less likely it is that Dreamweaver will render it correctly. You can achieve the same results that will render in Dreamweaver with far less convoluted css in my opinion.

Report · Aug 07, 2012

Eric doesn't deserve this criticism.

His involvement in this template is likely only that Joe chose to use Eric's reset CSS. There's nothing bleeding edge there.

Report · Aug 07, 2012

Murray *ACP* wrote:
Eric doesn't deserve this criticism.

Fair enough, everyones entitled to their opinion.

Was just saying it seems the more of an 'expert' people claim to be the more likely that they will try and confuse those that aren't by using techniques which aren't really required. i guess its their way of feeding their ego.

Report · Aug 07, 2012

osgood_ wrote:
Was just saying it seems the more of an 'expert' people claim to be the more likely that they will try and confuse those that aren't by using techniques which aren't really required. i guess its their way of feeding their ego.

Eric wasn't feeding his ego.

He was experimenting with advanced CSS and inspiring many people along the way.

Report · Aug 07, 2012

I certainly took inspiration from him as well! He's a great guy....

Report · Aug 07, 2012

osgood_ wrote:
He only ever produced css which was way ahead of what any current browser could interpret let alone a software program. Enough said.

He certainly pushed the envelope in the early days of CSS but he also pushed standards and usable CSS.

His approach is as pragmatic as much as it is experimental.

Report · Aug 07, 2012

John Waller wrote:
He certainly pushed the envelope in the early days of CSS but he also pushed standards and usable CSS.
His approach is as pragmatic as much as it is experimental.

I don't thing Eric ever create a 'real world' site or was that bothered about creating one. Only lectured and published a few books about css. The two are worlds apart.

Report · Aug 07, 2012

All I can say is I learned plenty of real world CSS from Eric in my early days.

Eric's Wordpress blog http://meyerweb.com is still being updated for those interested in his activities.

Report · Aug 07, 2012

John Waller wrote:
http://meyerweb.com is still going strong.

I wouldn't call it much of a commercial site myself. A playground for Eric, yes.

Report · Aug 07, 2012

osgood_ wrote:
John Waller wrote:
http://meyerweb.com is still going strong.
I wouldn't call it much of a commercial site myself. A playground for Eric, yes.

I changed the wording of my post because I changed what I wanted to say.

His blog is there for those who want to visit. It's not a commercial venture as far as I can see.

Report · Aug 07, 2012

John Waller wrote:
It's not a commercial venture as far as I can see.

That's my point. Often those without commercial experience have little in common with those that do. There's room for all of course.......you just need to work out who to rely on in different senarios. Eric, fortunately for me wasn't one of them.

Report · Aug 07, 2012

Getting back to your question, you could try and leave the reset as it is but remove all instances of "background: transparent;" or "background-image:transparent;" from your CSS and see if it clears up your issue. This has been the main culprit for CS6 design view looking different from previous versions.

Live View shows your design using a web browser engine to give the page a more accurate appearance, whereas Design View is just showing the code more or less as is and without many of the CSS styles applied - especially if you have used CSS3. It goes without saying but you should not rely on Design View to give an accurate representation of your site - that is what Live View is for.

Report · Aug 07, 2012

Very good. Thanks for the info Rik, its much appreciated!

Report · Aug 06, 2012

I would allow Murray to take you through this as he is using the more

logical path. The first thing you want to check is if your page is coded

correctly and to do that you need to allow Murray to see a live page. At

that point, if your code is valid, and works properly in browsers, but

still has problems, you must make a decision:

1. Use Design Time Style Sheets inside Dreamweaver to work around

Dreamweaver display bugs (of which there are many).

2. Dumb down your CSS to the point that Dreamweaver is capable of

displaying it like a modern browser.

--

Al Sparber - PVII

http://www.projectseven.com

The Finest Dreamweaver Menus | Galleries | Widgets

Since 1998