Dreamweaver 8 Design View render issue

I was wondering if anyone else has noticed a highly
irritating issue with DW8 that is apparently not an issue in the
Design View of DW MX 2004.
In DW 8 for some reason I'm getting an extra 150 pixels of
white space to the right of my #content container. It only appears
to happen when the content within the #content container does NOT
exceed the length of the content in my menu container (#priNav2).
In other words, if the content is longer then the menu, it renders
fine.
See here:
Dreamweaver
8
But, in DW mx2004 the exact same file shows up how it should.
Dreamweaver
MX 2004
Does anyone have any suggestions on how to resolve this issue
or have a clue as to why this is happening? It's really one of the
only bugs left preventing me from upgrading to DW 8 anymore.
Thanks,
- Paul

After some tinkering around and a call to Tech. Support I
eventually resolved this issue by pointing out a bug to Adobe.
Apparently the problem is the View / Visual Aids / Invisible
Elements option. If this is turned on, and you have a website set
up similiarly to
this one, you will
experience this sporatic, extranenous white space that shifts your
content around. It is not an issue in DW MX 2004, only DW 8.
The solution is to just simply turn OFF the "Invisible
Elements" option. Then the page will render the way it should.
A bug report has been submitted.

Similar Messages

Page Content Won't Display in Contribute (Edit Mode) or Dreamweaver (Design View)

I have pages on my site that have decided they don't want to display content either in Contribute (in edit
mode) or in DreamWeaver (in design view). They always look fine in Live view, prior to hitting the 'edit' button or when viewing in a browser. Using CS4 on Windows XP. I use Contribute for small edits and this renders that tool useless as there is no WYSIWYG. It's a pain in Dreamweaver to have to keep previewing in browser when I'm used to working in code/design view. Any help most appreciated. Here's the page I'm currently having the problem with:
http://www.pacaero.com/products/interconnect-medical.htm

That's odd because here's what I see ...

Hiding things in Dreamweaver Design view

Hi, I have this huge Flash object on my page that is covering
up roughly 75% of the page view. It is on a floating layer and I
need to insert text under it. However I can't draw a new layer to
do this, nevermind the fact that this huge gray box makes it
impossible to see what's under it. Can I hide this Flash object in
the design view, work under it, and then unhide it? Please refer to
this image: www.dwbgallery.com/stuff/dw-flashobject.jpg
Thanks!

Good luck dale....
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"dalewb" <[email protected]> wrote in
message
news:ec25so$f02$[email protected]..
>
quote:
Originally posted by:
Newsgroup User
> >...It is on a floating layer
>
> What's a floating layer? If it's a DW layer you can hide
it with the
> visibility options in the Layers Palette, but....
>
> >... and I need to insert text under it.
>
> Not sure why you want to put content "under" the Flash
element which will
> hide whatever it is.
>
>
> Thanks for the replies. Yes, it is a Dreamweaver layer.
A large portion
> of
> the Flash object is empty and published with the
transparency option on
> (wmode="transparent"). It was designed as a supplement
to the existing
> page
> structure (it in effect hovers over the page). You can
see it at work at
> www.dwbgallery.com/dev.html. I ended up figuring this
out, not through
> hiding
> the Flash object, but just by inserting the code I
needed by hand into the
> HTML.
>
> Murray, I took the time to screencapture, upload the
image to my
> webserver,
> and provide a link to it to insure my post was
understood. Between
> describing
> the question and doing that, I'm not sure how I could be
more clear.
> Nevertheless, you have a few promising links in your sig
I will take a
> gander
> at.
>
>
>

Centre not working in Dreamweaver Design View (CSS+HTML)- Preview OK- help!

Hi there
I am having a slight problem with DW which I have had before, and fixed, but I cant for the life of me remember how I fixed it. So any help is much appreciated.
I am producing a proof site for a client and cannot load it to be live just yet so sorry for any inconvience but I have taken some screen shots and will paste code/html.
The site is currently sitting like this in the design view of DW
[IMG]http://i1200.photobucket.com/albums/bb323/SKH_Design/Picture1-1.jpg[/IMG]
Which it usually doesnt.... its usually centred within the design view!!
this is how it sits in the preview
[IMG]http://i1200.photobucket.com/albums/bb323/SKH_Design/Picture2.png[/IMG]
My main page container is margin left auto and so is the margin right.
(please excuse my experiment with the drop shadow behind the main container)
please excuse me if anything is messy, im pretty new to this!!
Thanks, Sarah
Code -
<style type="text/css">
    
</style>
<script src="Scripts/swfobject_modified.js" type="text/javascript"></script>
<script type="text/javascript">

</script>
</head>
<body leftmargin="float">
<div class="shadow">
<div class="pagecontainer">
            
            <div class="topbarcontainer"><img src="images/pb-topbanner.jpg" width="800" height="126"></div>
                    <div class="navigationbar"> <img src="images/pb-linkbar1.jpg" width="353" height="34"><img src="images/pb-linkbar2home.jpg" width="87" height="34"><img src="images/pb-linkbar3products.jpg" width="198" height="34"><img src="images/pb-linkbar4offers.jpg" width="161"                                                                                                                                                                                                 height="34"></div>
                            
                            
                            <div class="flashcontainer">
                            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="800" height="257" id="FlashID" title="paulburtonflash">
                                <param name="movie" value="flashfiles/paulburtonflash.swf" />
                                <param name="quality" value="high" />
                                <param name="wmode" value="opaque" />
                                <param name="swfversion" value="6.0.65.0" />
                               <param name="expressinstall" value="Scripts/expressInstall.swf" />
                                
                                
                                <object type="application/x-shockwave-flash" data="flashfiles/paulburtonflash.swf" width="800" height="257">
                              
                              <param name="quality" value="high" />
                              <param name="wmode" value="opaque" />
                              <param name="swfversion" value="6.0.65.0" />
                              <param name="expressinstall" value="Scripts/expressInstall.swf" />
                              
                              <div>
                                <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
                                <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
                            </div>
                              
                            </object>
                                
                              </object>
                            </div>
                            
                   
                   <div class="mainbackground">
                   
                    <div class="homepagetext">
                    Established in 1980, we are a drinks wholesale business, based in the Scottish Borders which prides itself on being able to provide alcoholic and soft drinks in whatever quantity you require at outstanding prices and on time.<br><br>
We deliver 7 days a week and offer a free, prompt delivery service, by our own staff in the Borders, East Lothian and Midlothian.<br><br>
<div class="textspacer1"></div>
<div class="textsixe16">We have regular promotions - click here to view our latest special offers</div>
                    </div>
                    
                    <div class="homepageimage">
                    <img src="images/pb-home-mainimage.jpg" width="328" height="219"></div>
                    </div>
      <div class="bottombar">
              <div class="bottombartext">
                Paul Burton Drinks Wholesale, Pinnaclehill Industrial Estate, Kelso, Scottish Borders, TD5 8DW
            </div>
      </div>
</div>
</div>
</body>
</html>
CSS -
@charset "UTF-8";
/* CSS Document */
.shadow{
width:840px;
margin-left:auto;
margin-right:auto;
background-image:url(../images/editableshadow.png);
background-repeat:repeat-y;
.pagecontainer{
    width:800px;
    height:auto;
    margin-right:auto;
    margin-left:auto;
.topbarcontainer{
    width:800px;
    height:126px;
.navigationbar{
    width:800px;
    height:34px;
    float:left;
.flashcontainer{
    width:800px;
    height:257px;
    float:left;
.mainbackground{
    width:800px;
    height:349px;
    float:left;
    background-image:url(../../CL%20-%20New%20Ideas/Images/pb-home-background.jpg);
    background-repeat:no-repeat;
.homepagetext{
    width:372px;
    height:275px;
    float:left;
    margin:50px 0px 0px 50px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    color:#FFF;
.textsixe16{
    font-size:16px;
    font-weight:bold;
.textspacer1{
    height:15px;
    width:5px;
    color:#d6f3fc;
.homepageimage{
    width:328px;
    height:219px;
    float:left;
    padding:50px 0px 0px 20px;
.bottombar{
    width:800px;
    height:59px;
    float:left;
    background-image:url(../../CL%20-%20New%20Ideas/Images/pb-home-bottombar.jpg);
    background-repeat:no-repeat;
.bottombartext{
    width:600px;
    height:17px;
    float:left;
    font-size:12px;
    font-family:Arial, Helvetica, sans-serif;
    color:#000;
    padding:25px 0px 0px 50px;

"<body leftmargin="float">"
Can you say what that's doing? "float" is not a legal value for the leftmargin style, which requires an integer value. But its use is deprecated in favor of CSS anyhow.
Your pasted code is lacking a doctype or anything that would normally be above that stylesheet link. Is that just an oversight or is it really not there?

Dreamweaver design view doesn't show the bottom part of a long div

Hi!
I'm doing a very graphics oriented site, which basically requires me to use a large jpg as a background image and placing text areas against this background using absolute positioning.
My problem is that Dreamweaver doesn't show me the bottom part of my content div's background, but renders it as black instead. This obviously makes placing the text areas correctly difficult, since I can't see them against the background.
If I turn on Live view, then Dreamweaver shows the bottom part correctly. But in live view I can't use rulers and guides (or can I?).
Is there any setting that I can change so that Dreamweaver is showing me the whole div bg in all situations? One possible cause of this problem might be also that I'm using overflow:scroll on my content. Could that be why Dreamweaver hides the bottom part and can I change that behaviour?
Any ideas are welcome!

If we can see the page in question we could probably do this a lot easier. But all you need to do in your CSS for the background is:
background: url(pathto/image.jpg) fixed no-repeat;
If you are trying to absolutely position something in the middle you will be unable to do this without the assistance of javascript to determine the useable pixels on the end-users computer. Horiztonally is not the issue, but rather vertically because you can achieve horizontal centering by defining a width and setting the margin: 0 auto; in your CSS.
As far as working with overflows, if there is too much content in them that you believe the overflow will be necessary (assuming min/max-widths are set) you could consider including the content from another document or store it in a database and query the information out. Then it would make it easier for the client to update the content on their own in the future.

Dreamweaver Design view does not show parts of the page

Hello all,
I was working on a page update - page was created using a
template so
that the client can add content with Contribute - and have
discovered
that suddenly whole sections of the page are no longer
visible in Design
Mode. This caused me some panic until I viewed in code view
and found
everything still in there. Viewing in browser shows the page
there in
entirety too, and uploads just fine. But no matter what I do
- restart
the program, restart the computer - nothing changes, the page
design
does not show parts of this page. Everything is in an
editable area and
should be visible.
I have been editing the code as that was my only option, but
now I have
heard that my client cannot view those sections of the page
in her
Contribute either.
The page is here:
http://www.craft-design.ns.ca
Any help would be gratefully received.
Thanks
Ellie

> (I find it strange that it is now like this, as I
understood that th was
> depracated? So I went through and removed them all.)
<th> deprecated? Certainly not.
> There are editable regions in the page as it has been
working for the past
> year and a half. I find that after an amount of editing
by Contribute
> users, the pages do tend to fall apart.
Normal template files have two editable regions in the head
of the page -
doctitle, and head
The one you linked does not.
That's what I was talking about.
> Contribute sounds a great thing, but is a huge pain and
ends up costing me
> money fixing the messes my clients end up making, though
this should not
> be possible...
I have stopped recommending it to my clients.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"Ellie" <[email protected]> wrote in message
news:[email protected]...
> Thanks Murray,
>
> I see all this.
>
> (I find it strange that it is now like this, as I
understood that th was
> depracated? So I went through and removed them all.)
>
> There are editable regions in the page as it has been
working for the past
> year and a half. I find that after an amount of editing
by Contribute
> users, the pages do tend to fall apart.
>
> I will have to remake the template and remake the page
from that.
>
> Strange thing is it was working perfectly well before.
>
> Thanks for the help, Murray.
>
> Contribute sounds a great thing, but is a huge pain and
ends up costing me
> money fixing the messes my clients end up making, though
this should not
> be possible...
>
> Ellie
>
> Murray *ACE* wrote:
>
>> You have no editable regions in the head of that
page - why is that?
>>
>> As for the display in DW, perhaps it's the 175
validation errors that the
>> W3C validator finds on the page?
>>
>>
http://validator.w3.org/check?verbose=1&uri=http://www.craft-design.ns.ca/mbg_past_shows.h tml
>>
>> Most of these are serious coding problems....
>>
>

Why is Dreamweaver's design view so messed up?

Hi
I am sure this has been asked and answered loads of times but here goes again.
Dreamweaver gets a lot of bad press because of it's design view but why does Dreamweavers Design view render web pages so badly? Even pages that validate and are well structured often render very poorly. Why is this?
It's not as if DW doesn't have a decent rendering engine built in - live view works perfectly well. And Contribute seems to be able to present an editable page rendered correctly.
The design view obviously has some sort of rendering engine to do it's job but is it a bespoke, poorly written one that it's not up to the job? Why keep it if doesn't work? Is there just no will to fix it?

I don't like vendor prefexes. Perhaps I'm old-fashioned, but I like less code.
An example:
body {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 100%;
          color: #000000;
          background-color: #fff;
          margin: 0;
          padding: 0;
          background: #402a67; /* Old browsers */
          background: -moz-linear-gradient(top, #402a67 0%, #ffffff 70%) fixed no-repeat; /* FF3.6+ */
          background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#402a67), color-stop(70%,#ffffff)) fixed; /* Chrome,Safari4+ */
          background: -webkit-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* Chrome10+,Safari5.1+ */
          background: -o-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* Opera11.10+ */
          background: -ms-linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* IE10+ */
          filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#402a67', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
          background: linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* W3C */
Now, if everyone would agree on a standard, the graduated background would be described thusly:
body {
          font-family: Arial, Helvetica, sans-serif;
          font-size: 100%;
          color: #000000;
          background-color: #fff;
          margin: 0;
          padding: 0;
background: #402a67; /* Old browsers if needed at all */
background: linear-gradient(top, #402a67 0%,#ffffff 70%) fixed; /* W3C */
That's 8 lines of code instead of 13.
One might ask how much longer it takes a browser to load that much extra code that is specific to other browsers and not the one one is actually using.
Dreamweaver does display the background correctly here, but only in Live View. And, with some of the colors, I find it nearly impossible to see some of the type.

Output shown in Design view of Dreamweaver CS6 is not same as shown by the browsers

I have made a yoga website http://ballychohan.co/ in Dreamweaver CS6. I faced this problem while designing the website.The results shown by Design view in Dreamweaver is not correct. It made me very confused at the starting. Please tell me how to overcome this problem of DreamWeaver. Should I install a lower version of Dreamweaver ?

Bally Chohan wrote:
I have made a yoga website http://ballychohan.co/ in Dreamweaver CS6. I faced this problem while designing the website.The results shown by Design view in Dreamweaver is not correct. It made me very confused at the starting. Please tell me how to overcome this problem of DreamWeaver. Should I install a lower version of Dreamweaver ?
Does the page show correctly in a browser?
Dreamweaver design view is not very reliable at renedering designs exactly the way you want them to look, especailly if you use more of the complex and up-to-date css, now available. Dreamweaver is always playing catch-up in that area.

CSS is not showing in design view

Hello, I wonder if anyone can help. I would appreciate very
much if you can... I have read all the css related problems, but
did not see the problem I am having.
Anyway, I have done a website template for someone and I gave
it to him to update the contents. However, on his dreamweaver
Design view, the css does not support it at all so it looks all
messy. Though when he preview it on IE, this is all fine. I have
made templates and css files with dreamweaver and I can view
everything fine. He seems to have the same version of DW (MX 2004)
so I am not sure how this happens. We were looking in everything
(including goofy css as someone says on this forum), but have no
luck so far. Here is my link and I pasted my css here.
http://www.norithefish.com/index2.html
Many thanks for this.
Noriko
/* HTML tag styles */
body
{background: #cccccc; font-family: Verdana, Arial, Helvetica,
sans-serif;
font-size: small; color: #000000; font-weight: normal}
a { color: #333333; text-decoration: none }
a:active { color: #666666; text-decoration: none }
a:hover { color: #CC3300; text-decoration: underline }
.bodytext { font-size: small; color: #000000; font-weight:
normal}
.smalltext { font-size: x-small; color: #000000; font-weight:
normal}
.smalltextw { font-size: x-small; color: #ffffff;
font-weight: normal}
.title{ font-size: 1.5em; font-weight: bold; color: #CC3300}
.wbracket{ font-size: small; font-weight: normal; color:
#ffffff}
.smalltitle { font-size: 1em; font-weight: normal; color:
#666666}
.sub { font-size: small; font-weight: bold; color: #ffffff }
.foot { font-size: x-small; font-weight: normal; color:
#000000}
h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.5em;
color: #cc3300
h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.15em;
color: #cc3300
h3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
color: #666666
ul{
list-style-type: square;
ul ul{
list-style-type: disc;
ul ul ul{
list-style-type: none;
/* Layout Divs */
#pageNav{
float: left;
width:21.3%;
top:10px;
padding-left: 0px;
border-bottom: 1px solid #cccccc;
border-right: 1px solid #cccccc;
#content{
width:75%;
float: left;
padding: 0px 0px 0px 0px;
margin: 0px 0px 1px 20px;
/* Component Divs */
#siteName{
margin: 0px;
padding: 16px 0px 8px 0px;
color: #ffffff;
font-weight: normal;
/************** feature styles *****************/
.feature{
padding: 0px 0px 0px 0px;
font-size: 100%;
/************* #siteInfo styles ***************/
#siteInfo{
clear: both;
font-size: 100%;
background-color: #999999;
padding: 0px 0px 0px 0px;
border-top: 1px solid #666666;
/************* #smalltitle styles ***************/
#smalltitle{
clear: both;
background-color: #ffffff;
font-size: 100%;
padding: 0px 0px 0px 0px;
border-top: 1px solid #CC3300;
border-bottom: 1px solid #CC3300;
/*********** #sectionLinks styles ***********/
#sectionLinks{
position: relative;
width: 150px;
margin: 0px;
padding: 0px;
border-bottom: 1px solid #cccccc;
font-size: 90%;
#sectionLinks a:link{
font-size: 1.15em;
padding: 2px 0px 5px 10px;
border-top: 1px solid #cccccc;
width: 100%;
width: auto;
#sectionLinks a:visited{
font-size: 1.15em;
border-top: 1px solid #cccccc;
padding: 2px 0px 5px 10px;
#sectionLinks a:hover{
font-size: 1.15em;
border-top: 1px solid #cc3300;
background-color: #dddddd;
padding: 2px 0px 5px 10px;
/*********** .frame styles ***********/
.frame {
width: 700px;
left: 50%;
padding-top: 0px;
margin-left: -350px;
margin-top: 0px;
position: absolute;
visibility: visible;
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
border-right: 1px solid #999999;
border-left: 1px solid #999999;
background-color: #ffffff;
.bg {
height: 1px;
background-color: #cccccc;
width: 100%;
/*********** #pageNav link styles ***********/
#pageNav ul a:link, #pageNav ul a:visited {display: block;}
#pageNav ul {list-style: none; margin: 0; padding: 0;}
/* hack to fix IE/Win's broken rendering of block-level
anchors in lists */
#pageNav li {border-bottom: 1px solid #EEE;}
/* fix for browsers that don't need the hack */
html>body #pageNav li {border-bottom: none;}
/********************* end **********************/

> *** you are missing <li> at the beginning of the
line and </li> at the end
> or you want to remove the </li> from the previous
lines.
Or move the image within the existing pair. You cannot have
that
construction, though -
<li>blah</li>
<img>
<li>blah</li>
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"josie1one" <[email protected]> wrote in message
news:[email protected]...
> It sounds to me as if it's a path issue.
> Your path is this:
> <link rel="stylesheet" href="styles/inside.css"
type="text/css">
>
> Does he have a folder called "styles" within which
should be the
> stylesheet?
>
> You have a couple of code problems (I'd say unrelated to
your question).
> <li><a href="1-about.html">Order your Tshirt
</a></li>
> <img src="ferrari_team_polo.jpg" alt="photo of a
T-shirt" width="120"
> height="180">***
> <li><a href="1-about.html">Order your
cap</a></li>
> <img src="ferrari_cap.jpg" alt="photo of a cap"
width="120"
> height="75"><br>***
>
> *** you are missing <li> at the beginning of the
line and </li> at the end
> or you want to remove the </li> from the previous
lines.
>
> and according to
>
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.norithefish.com%2Findex2.html
>
> you have an extra </div> a couple of lines above
the </body>
>
>
> --
> Jo
>
>
>
>
>
> "norithefish" <[email protected]> wrote
in message
> news:[email protected]...
>> Hello, I wonder if anyone can help. I would
appreciate very much if you
>> can...
>> I have read all the css related problems, but did
not see the problem I
>> am
>> having.
>>
>> Anyway, I have done a website template for someone
and I gave it to him
>> to
>> update the contents. However, on his dreamweaver
Design view, the css
>> does not
>> support it at all so it looks all messy. Though when
he preview it on IE,
>> this
>> is all fine. I have made templates and css files
with dreamweaver and I
>> can
>> view everything fine. He seems to have the same
version of DW (MX 2004)
>> so I am
>> not sure how this happens. We were looking in
everything (including goofy
>> css
>> as someone says on this forum), but have no luck so
far. Here is my link
>> and I
>> pasted my css here.
>>
>>
http://www.norithefish.com/index2.html
>>
>> Many thanks for this.
>> Noriko
>>
>> /***********************************************/
>> /* HTML tag styles */
>> /***********************************************/
>>
>> body
>> {background: #cccccc; font-family: Verdana, Arial,
Helvetica, sans-serif;
>> font-size: small; color: #000000; font-weight:
normal}
>>
>> a { color: #333333; text-decoration: none }
>>
>> a:active { color: #666666; text-decoration: none }
>>
>> a:hover { color: #CC3300; text-decoration: underline
>>
>> .bodytext { font-size: small; color: #000000;
font-weight: normal}
>>
>> .smalltext { font-size: x-small; color: #000000;
font-weight: normal}
>>
>> .smalltextw { font-size: x-small; color: #ffffff;
font-weight: normal}
>>
>> .title{ font-size: 1.5em; font-weight: bold; color:
#CC3300}
>>
>> .wbracket{ font-size: small; font-weight: normal;
color: #ffffff}
>>
>> .smalltitle { font-size: 1em; font-weight: normal;
color: #666666}
>>
>> .sub { font-size: small; font-weight: bold; color:
#ffffff }
>>
>> .foot { font-size: x-small; font-weight: normal;
color: #000000}
>>
>>
>> h1 {
>> font-family: Verdana, Arial, Helvetica, sans-serif;
>> font-size: 1.5em;
>> color: #cc3300
>> }
>> h2 {
>> font-family: Verdana, Arial, Helvetica, sans-serif;
>> font-size: 1.15em;
>> color: #cc3300
>> }
>> h3 {
>> font-family: Verdana, Arial, Helvetica, sans-serif;
>> font-size: 1em;
>> color: #666666
>> }
>>
>> ul{
>> list-style-type: square;
>> }
>>
>> ul ul{
>> list-style-type: disc;
>> }
>>
>> ul ul ul{
>> list-style-type: none;
>> }
>>
>>
>> /***********************************************/
>> /* Layout Divs */
>> /***********************************************/
>>
>> #pageNav{
>>
>> float: left;
>> width:21.3%;
>>
>> top:10px;
>> padding-left: 0px;
>> border-bottom: 1px solid #cccccc;
>> border-right: 1px solid #cccccc;
>> }
>>
>> #content{
>> width:75%;
>> float: left;
>> padding: 0px 0px 0px 0px;
>>
>> margin: 0px 0px 1px 20px;
>>
>> }
>>
>>
>> /***********************************************/
>> /* Component Divs */
>> /***********************************************/
>> #siteName{
>> margin: 0px;
>> padding: 16px 0px 8px 0px;
>> color: #ffffff;
>> font-weight: normal;
>> }
>>
>>
>> /************** feature styles *****************/
>>
>> .feature{
>> padding: 0px 0px 0px 0px;
>> font-size: 100%;
>>
>>
>> }
>>
>>
>>
>> /************* #siteInfo styles ***************/
>>
>> #siteInfo{
>> clear: both;
>>
>> font-size: 100%;
>> background-color: #999999;
>> padding: 0px 0px 0px 0px;
>> border-top: 1px solid #666666;
>> }
>>
>> /************* #smalltitle styles ***************/
>>
>> #smalltitle{
>> clear: both;
>>
>> background-color: #ffffff;
>> font-size: 100%;
>> padding: 0px 0px 0px 0px;
>> border-top: 1px solid #CC3300;
>> border-bottom: 1px solid #CC3300;
>>
>> }
>>
>>
>>
>> /*********** #sectionLinks styles ***********/
>>
>> #sectionLinks{
>> position: relative;
>> width: 150px;
>> margin: 0px;
>> padding: 0px;
>> border-bottom: 1px solid #cccccc;
>> font-size: 90%;
>>
>> }
>>
>>
>>
>> #sectionLinks a:link{
>> font-size: 1.15em;
>> padding: 2px 0px 5px 10px;
>> border-top: 1px solid #cccccc;
>> width: 100%;
>>
>> width: auto;
>> }
>>
>> #sectionLinks a:visited{
>> font-size: 1.15em;
>> border-top: 1px solid #cccccc;
>> padding: 2px 0px 5px 10px;
>> }
>>
>> #sectionLinks a:hover{
>> font-size: 1.15em;
>> border-top: 1px solid #cc3300;
>> background-color: #dddddd;
>> padding: 2px 0px 5px 10px;
>> }
>>
>>
>>
>>
>> /*********** .frame styles ***********/
>> .frame {
>> width: 700px;
>> left: 50%;
>> padding-top: 0px;
>>
>> margin-left: -350px;
>> margin-top: 0px;
>> position: absolute;
>> visibility: visible;
>>
>> border-top: 1px solid #999999;
>> border-bottom: 1px solid #999999;
>> border-right: 1px solid #999999;
>> border-left: 1px solid #999999;
>> background-color: #ffffff;
>> }
>> .bg {
>> height: 1px;
>>
>> background-color: #cccccc;
>> width: 100%;
>> }
>>
>> /*********** #pageNav link styles ***********/
>>
>> #pageNav ul a:link, #pageNav ul a:visited {display:
block;}
>> #pageNav ul {list-style: none; margin: 0; padding:
0;}
>>
>> /* hack to fix IE/Win's broken rendering of
block-level anchors in lists
>> */
>> #pageNav li {border-bottom: 1px solid #EEE;}
>>
>> /* fix for browsers that don't need the hack */
>> html>body #pageNav li {border-bottom: none;}
>>
>> /********************* end **********************/
>>
>>
>>
>>
>
>

Inserting tabbed navigation code makes my web page not display in design view..

Hi everyone..
I am on Dreamweaver 8 for MAC, and was working on a couple of web pages..these pages included divs and tables. But when I tried inserting a tabbed navigation I found at:
http://www.dynamicdrive.com/dynamicindex17/tabcontent.htm
In a nutshell, it asked me for step 1 to:
Step 1: Insert the below CSS and script into the HEAD section of your page:
<link rel="stylesheet" type="text/css" href="tabcontent.css" />
<script type="text/javascript" src="tabcontent.js">
* Tab Content script v2.2- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
</script>
The next step was this:
Step 2: Finally, simply add the below HTML to where you wish the Tab Content to appear on the page:
<h3>Demo #1- Basic implementation</h3>
<ul id="countrytabs" class="shadetabs">
<li><a href="#" rel="country1" class="selected">Tab 1</a></li>
<li><a href="#" rel="country2">Tab 2</a></li>
<li><a href="#" rel="country3">Tab 3</a></li>
<li><a href="#" rel="country4">Tab 4</a></li>
<li><a href="http://www.dynamicdrive.com">Dynamic Drive</a></li>
</ul>
<div style="border:1px solid gray; width:450px; margin-bottom: 1em; padding: 10px">
<div id="country1" class="tabcontent">
Tab content 1 here<br />Tab content 1 here<br />
</div>
<div id="country2" class="tabcontent">
Tab content 2 here<br />Tab content 2 here<br />
</div>
<div id="country3" class="tabcontent">
Tab content 3 here<br />Tab content 3 here<br />
</div>
<div id="country4" class="tabcontent">
Tab content 4 here<br />Tab content 4 here<br />
</div>
</div>
<script type="text/javascript">
var countries=new ddtabcontent("countrytabs")
countries.setpersist(true)
countries.setselectedClassTarget("link") //"link" or "linkparent"
countries.init()
</script>
<p><a href="javascript:countries.cycleit('prev')" style="margin-right: 25px; text-decoration:none">Back</a> <a href="javascript: countries.expandit(3)">Click here to select last tab</a> <a href="javascript:countries.cycleit('next')" style="margin-left: 25px; text-decoration:none">Forward</a></p>
<hr />
Well, I did all the steps required, but when I put this inside a div I had inside a table, all of a sudden I couldnt see anything in my design view, only two tables that arent even the same size..When I take out all this code, I get back my regular page..Can I see this tabbed navigation in my design view? Unfortunately, I dont have the spry widgets since I am on Dreamweaver 8..If I preview it in both Safari and Firefox (on Mac Firefox/3.0.8) (Safari 3.2.1) I can see everything fine, including the tabbed navigation..But designing in code isnt really helpful because I want to see what it looks like in design view, in case we change things-its just easier for me to work on..So I assume there is something in this code that is making my design view show nothing..
Update:I tried taking out the code again, but this time, I couldnt see anything again, even without this code..
I know that I can go to validation website, and I got a lot of errors-but all the pages I have that are in the same style have those same errors too—and they display fine..its only when I insert this specific piece of code that everything goes haywire..Is it even possible to view tabbed navigations (like the one in the above link) inside of Dreamweaver Design View?
Any help would be appreciated..

DW8 doesn't render any dynamic content, so I'd say it's a no go. You'll just have to live with that limitation or upgrade to CS4...
Mylenium

Nested div tags "Design View" problem

I have had ongoing problems using nested div tags to layout
my page. The page displays correct in browser but does not display
properly in Dreamweaver Design View. Highlighting the CSS id in
Code View shows the correct groupings. The code also passed the
validator test.
I am fairly new at Dreamweaver so I could be missing
something basic.
Code is displayed at
http://www.mektronix-net.campusbizcenter.com/

I've not see this before, so can't say why it would be happening. Would the pc be low on resources? but then again you say it happened even after a restart of the pc.
Maybe you could try the file cache and the personal configuration folder fix to see if it fixes any issues.
http://forums.adobe.com/thread/417116#cache
PS: While I'm at it, it would be wrong for me to point out that using AP divs is not the optimum way to create a layout.... unless you know the repercussions of using them.
Here's why: (from the Dreamweaver FAQ)
http://forums.adobe.com/thread/477969

Design View not rendering content of pages

I am the webmaster and lead developer for a state university. We have developed a responsive Dreamweaver template for our mostly non-coding users (admin assistants usually are assigned web tasks for some reason). You can see our site here http://www.wwu.edu/webtech . When we bring up pages in Design View, they cannot be edited; none of the content is visible. Live view is pretty good, but it's difficult for non-coders to edit in this window. For instance, in Design view they can just select Enter after a block of text to start a new <p>; In Live View you can modify an existing paragraph as if you were in Design View, but you cannot add elements without using the Insert tool. My non code users have no idea what the Insert menu is talking about. So my questions are:
1. First - has anyone else hit situations where Design View did not work? Here is what it looks like for the site mentioned above:
2. Any idea why design view cannot handle this page? It's a standard responsive site with media queries... I've tried stripping out complexity but cannot get it to work. It is valid HTML and passes tests.
3. Am I using the wrong product? Can Muse handle Dreamweaver templates?

Nancy O, osgood_, Fritz, thank you for your thoughts.
Dreamweaver has been a wonderful tool for non-coders for many years. We developed templates for the groups, then all they had to do was put the content into the correct areas through the power of the Dreamweaver template. That is no longer possible it seems with the more complex, responsive templates. And yes, Osgood_ , it does appear that some pages will be rendered fine in Dreamweaver. Our older templates such as represented by this site: http://www.wwu.edu/bservices IS viewable and editable in Dreamweaver Design view. Those users are quite happy. However our newest responsive Dreamweaver templated sites such as http://www.wwu.edu/webtech and http://www.wuw.edu/registrar2 are not.
What I'd really love is for an adobe engineer to sit down and look at our templates and let me know if there is anything I could do to make these templates usable in Design View.
Our other alternative is to move away from static HTML and Dreamweaver and go entirely to WordPress and Drupal. I will miss Dreamweaver when this happens! I had hoped there was a place for those who did not want the complication of a Wordpress site...

Img Does not appear in Design View

Dreamweaver 8
Have an image that I would presume has a simple enough presence in the page...
<table width="985" border="1" cellspacing="0" cellpadding="0" height="100">
   <tr>
      <img src="Includes/Images/ButtonsNBanners/bnrPrimaryTop.png" alt="test" width="1074" height="94" border="0" usemap="#Map1">
   </tr>
</table>
...and sure enough the image appears as expected at runtime.
But within Dreamweaver Design View it does not appear at all.
Why?
I have multiple other images on this page that all appear within the designer as expected, but not this one.
My main problem right now is that I need a map associated with this image and would really like to use DW's tools to create and position the <area> tags.
Has anyone seen this sort of behavior in DW8 before?
All input welcome and appreciated!!!

That was it KathH --- THANKS!!!
Had created the row w/out <td> cells to carry the top banner (sort of cheating) on spanning the cells i guess ( )
Anyway, re-wrote so that the banner table was independant and did not require span and picked up the data table independantly.
Problem solved and designer picked up the image precisely.
Thanks again!!!
Curious though that the image is dependant on the <td> tag. I would have expected any image called within the page to display in the designer regardless of location in the html.
Oh well, fixed and onto the next challenge.
Once more THANKS!!!

Table in design view not displaying properly

I put in a table at 100% width - to house a spry menu. It shows up fine in all browsers and in live mode, but in dreamweaver design view the table and menu display off to the right - outside of the workspace. It's a pain! How do I fix this?

You certainly do NOT need a table to hold your menu -- no matter which one you use.
Table layouts went the way of the dinosaur last century. Nowadays, we use CSS for layouts. To illustrate, copy & paste this code into a new, blank document and preview in browsers.
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>HTML5 Document</title>
<style>
    /**fixes the box model**/
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
/**basic layout**/
body {
    width: 80%; /**adjust width in px, em or % as desired**/
    margin:0 auto; /**with width, this is centered**/
    background: maroon;
    font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size: 100%;
header, footer { color: #FFF; }
/**left sidebar**/
aside {
    display:table-cell;
    width: 25%;
    padding: 1%;
    background: #C99;
/**main content**/
article {
    width: 75%;
    display:table-cell;
    padding: 2%;
    border-left: 1px dotted silver;
    background: #EAEAEA;
footer {
    clear: left;
    font-size: 80%;
    text-align: center;
/* BEGIN HORIZONTAL DROP-MENU */
nav {
    position: relative;
    width: 100%; /**adjust width as needed**/
    margin: 0 auto;
    padding: 0;
    text-align: center;
    z-index: 1000;
nav ul {
    margin: 0;
    padding: 0
nav li {
    list-style: none;
    font-size: 12px;
    float: left;
    text-align: center;
/**top level menu**/
nav li a {
    display: block;
    text-decoration: none;
    margin-right: 2px;   /* space between links */
    width: 12em;   /* adjust as needed or use auto */
    padding: 6px 15px;
    font-weight: bold;
    line-height: 2em;
    color: #1e5799;
    border: 1px solid #FFF;
    background: #C7D5E3;
/**top menu style on mouse over**/
nav li:hover > a {
    color: #FFF;
    background: #1e5799;
/**sub-menu**/
nav li ul {
    display: none;
    text-align: center;
    margin: 0;
    padding: 0 1em;
    background: #C7D5E3;
    font-weight: normal;
    font-style: oblique;
/**sub-menu, help for older IE**/
nav li:hover ul, nav li.hover ul {
    display: block;
    position: absolute;
    padding: 0;
nav li:hover li, nav li.hover li { float: none; }
/**drop-menu style**/
nav li:hover li a, nav li.hover li a {
    width: 12em; /* adjust width as needed or use auto */
    margin-top: 0;
    line-height: 1.25em;
    font-weight: normal;
    border: none;
/**drop-menu style on mouse over**/
nav li li a:hover {
    background: #D3E1B7;
    color: #004A43;
/**clear floats**/
nav:after {
    clear: both;
    display: block;
    content: '';
/**END DROP MENU STYLES**/
</style>
</head>
<body>
<header>
<h1>Your Awesome Site Name</h1>
<h2>Some Pithy Slogan</h2>
</header>
<nav>
<ul>
<li><a href="#">Menu Item1 ▼</a>
    <ul>
    <li><a href="#">Sub_menu1a</a> </li>
    <li><a href="#">Sub_menu1b</a> </li>
    </ul>
</li>
<li><a href="#">Menu Item2 ▼</a>
    <ul>
    <li><a href="#">Sub_menu2a</a> </li>
    <li><a href="#">Sub_menu2b</a> </li>
    <li><a href="#">Sub_menu2c</a> </li>
    <li><a href="#">Sub_menu2d</a> </li>
    </ul>
</li>
<li><a href="#">Menu Item3</a></li>
<li><a href="#">Menu Item4</a></li>
<li><a href="#">Menu Item5</a></li>
</ul>
</nav>
<aside>
<h3>Left Sidebar</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. </p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. </p>
</aside>
<article>
<h3>Aritcle Heading</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi! Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim. </p>
</article>
<footer>
<small>© 2015 Your Site Name. All rights reserved.</small>
</footer>
</body>
</html>
Nancy O.

HTML entity missing in Design View

Hi Folks,
When I use the HTML entity → (right arrow), it renders properly in browsers as an arrow, but it shows as an empty box in Dreamweaver Design View. This is common with some other special characters also.
Any idea as to why this happens?
Thanks.
Paul
Dreamweaver 8
Windows XP Pro SP3

I just tried it in DW8 and it works for me.
Pasted in code view. →
Are you using a valid document type?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Dreamweaver 8 Design View render issue

Similar Messages

Maybe you are looking for