Skip to main content
A
ahdesigner
Participating Frequently
May 10, 2012
Question

CS6 div problem

  • May 10, 2012
  • 7 replies
  • 19168 views

Hey,

I have a problem with transparent DIVs. In Dreamweaver CS6 Design view the background is displayed white. Therefore you can not see the background image of the body tag. If I view the page in a browser everything is displayed correctly. Is this a bug in CS6? When I open the same page with Dreamweaver CS5.5 eveything is viewed correctly, too!

Anyone an idea?

    This topic has been closed for replies.

    7 replies

    G
    Gaehelton
    Participant
    June 24, 2012

    Thank you! Removing the excess code worked like a Dream!

    background-color:transparent;

    M
    mrpug1969
    Participant
    June 8, 2012

    Hi There,

    I recently had this problem myself with DW6 using my new iMac. I managed to resolve the display issue within my CSS screen file.

    I have the Eric Meyer 'Reset' code at the beginning of my file, the problem 'for me' was:-

    background: transparent;

    I have commented this out of the CSS file and now in Design View my pages view just fine and as good as 'Live View'.

    Hope this helps for what its worth, I know how dreadfully frustrating it can be!!!! Grrrrrr.

    Gary

    V
    vanbeekum
    Participating Frequently
    June 8, 2012

    Gary!!!!!

    You are brilliant. I also use Eric Meyer's "Reset" code at the beginning of my files. That totally fixed the problem. I was going to look into this and wondered if there was an issue there and then got sidetracked - you saved me a lot of time!!

    None the less... it seems this shouldn't be something that should happen, but now with the reason behind it - it seems insignificant.

    Thank you!!!!

    Very happy Friday!

    Rik Ramsay
    Rik Ramsay
    Participating Frequently
    June 8, 2012

    I feel like you could have saved yourself a lot of typing and frustration as this fix was discussed at the very beginning of this thread.

    This issue has come up a few times in the forum, recently as well so a quick search may have saved you some time. In fact, the following link is even linked at the top off this thread.

    http://forums.adobe.com/message/4395578#4395578

    Glad you got it sorted though.

    C
    CobaltCat
    Participant
    June 5, 2012

    Has any fix been found for this?

    M
    mdoudoroff
    Participating Frequently
    June 5, 2012

    See response #15, above. The Dreamweaver team has acknowledged the issue, but not promised a fix.

    AllDayDev2
    Community Manager
    AllDayDev2Community Manager
    Community Manager
    May 12, 2012

    Thanks for reporting this. As Nancy mentioned, the best way to send issues like this is the bug report form. (I see that you sent one in this morning, so thanks!)

    The team will investigate the issue, but at this point I have no idea if it's expected behavior (this seems unlikely) or when they might be fixing it.

    I'll be direct in saying that I do not recommend using Design View as a visual reference for anything; only use it for laying out containers, inserting content, etc.

    My recommendation is to always switch on Live View for previewing within Dreamweaver.

    V
    vanbeekum
    Participating Frequently
    June 6, 2012

    Telling someone not to use Design View is hilarious!! That is one of the important features of Dreamweaver, to be able to (not perfectly) view what you are doing visually as you execute. We all know to see the exact we have live view or browser.

    This bug is very bad as in many cases it renders the text as invisible which means you can really only work in code view when creating text - hilarious if you think that you can release an upgrade, and undermine an important and well used feature in it.

    Can you please tell us that Adobe acknowledges this as a serious bug and when it will be fixed even if ballpark. And I would personally like to know if Adobe considers this something serious they intend to fix as I haven't paid for the upgrade yet and this could easily be a deciding factor to either stay with 5.5 or use Coda.

    John Waller
    Community Expert
    John WallerCommunity Expert
    Community Expert
    June 6, 2012
    pvb-sf wrote:

    Telling someone not to use Design View is hilarious!!

    Seems like you've chosen to deliberately misconstrue what Carey is trying to say.

    pvb-sf wrote:as I haven't paid for the upgrade yet and this could easily be a deciding factor to either stay with 5.5 or use Coda.

    Just bear in mind that when CS7 is released, only those on CS6 are eligible for upgrade pricing.

    Everyone else (including CS5.5) pays full price.

    A
    ahdesignerAuthor
    Participating Frequently
    May 11, 2012

    Hi PZ,

    removing the style="background: transparent;" is not the solution, because the div with the blue background is also viewed as white background in Dreamweaver CS6.

    Rik Ramsay
    Rik Ramsay
    Participating Frequently
    May 11, 2012

    Yes but you are somehow expecting a vendor specific background gradient to show in design view. This doesn't work in DW CS4, CS5.5 and I would imagine is unlikely to work in CS6. Live View might show the gradient though. Also, you have them the wrong way round. For your expected results the background-color:blue; needs to go AFTER the gradient background.

    Remove the gradient and you will see the blue background. Also, I would also advise changing it to background-color:blue; as you only have one attribute.

    M
    mdoudoroff
    Participating Frequently
    May 11, 2012

    Rik,

    I very specifically to NOT expect Design view to pay any attention whatsoever to vendor-specific background gradients (I state as much in the test file). Design view should ignore them, not paint the element white. In fact, I expect Design view to ignore anything and everything it doesn’t understand, rather than make assumptions.

    Your background stacking order advice raises lots of off-topic problems. You are correct that moving the “background-color: blue;” masks the bug, but that’s hiding the problem, not fixing it.

    Martin

    A
    ahdesignerAuthor
    Participating Frequently
    May 10, 2012

    Hey Nancy,

    that doesn't work. But it's very funny. In the Design View in Dreamweaver CS6 the problem appears (transparent DIVs are shown white). But when I switch to Live View everything is viewed correctly. That is very annoying, because in Live View Modus you can not select the elements on the page and you don't have the guide lines around the elements . You have to switch between Live and Design Mode.

    Does anybody know, if Adobe is working on a fix for that problem?

    ah

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    May 10, 2012
    that doesn't work.

    What doesn't work?  Disabling CSS or using a Design-Time Style ?

    Does anybody know, if Adobe is working on a fix for that problem?

    Unknown.  You're not the only person to mention this.

    http://forums.adobe.com/message/4387543#4387543

    Be sure to file an official bug report with specifics so engineers can re-produce the problem.

    https://www.adobe.com/cfusion/mmform/index.cfm?name=wishform

    Nancy O.

    Nancy O'Shea— Product User & Community Expert
    M
    mdoudoroff
    Participating Frequently
    May 11, 2012

    Ok, I've taken considerable personal time to document this bug. CS6 clearly introduced a background-related bug in its Design view that wasn’t there in CS5. The bug is simple to reproduce and has wideranging implications. I’m trying to submit a bug report, but their form is so brain-dead that it’s making it hard. I’m posting my bug report here, along with a link to the test file and then filing this thread in my report. I hope it works out and somebody at Adobe looks at it. (There’s always hope.)

    This is a perfectly reproducible bug in Design view. Paste the attached HTML into a file and load the file into Dreamweaver 12 (CS6). Compare the Design and Live views. Compare against the behavior in Dreamweaver 11 (CS5).

    <!DOCTYPE html>

    <html lang="en">

    <head>

    <meta charset="utf-8" />

    <title>HTML5/CSS Dreamweaver CS6 Test Page</title>

    </head>

    <body style="background-color: black;color: #999;">

        <h1>DW CS6 Test</h1>

              <p>The background of this page is set to black and body color is set to #999.</p>

              <div style="background: transparent;">This is a div with <strong>background</strong> set to transparent.<br>In DW CS6 Design view, this div incorrectly renders as solid white.<br>Expected behavior: div should have the black background of the body showing through.</div>

              <br>

              <div style="background-color: transparent;">This is a div with <strong>background-color</strong> set to transparent.<br>In DW CS6 Design view, this div incorrectly renders as solid white.<br>Expected behavior: div should have the black background of the body showing through.</div>

              <br>

              <div style="background: linear-gradient(left, rgba(205,235,142,1) 0%,rgba(165,201,86,1) 100%);">This is a div with <strong>background</strong> set to "linear-gradient(left, rgba(205,235,142,1) 0%,rgba(165,201,86,1) 100%);".<br>In DW CS6 Design view, this div renders incorrectly as solid white.<br>Expected behavior: div should either have the correct gradient background as specified <strong>OR</strong> the black background of the body should show through.</div>

              <br>

              <div style="background: -webkit-linear-gradient(left, rgba(205,235,142,1) 0%,rgba(165,201,86,1) 100%);">This is a div with <strong>background</strong> set to "-webkit-linear-gradient(left, rgba(205,235,142,1) 0%,rgba(165,201,86,1) 100%);".<br>In DW CS6 Design view, this div renders incorrectly as solid white.<br>Expected behavior: the black background of body should show through (it would not be appropriate to emulate the vendor-specific CSS extension).</div>

              <br>

              <div style="background: blue; background: -moz-linear-gradient(top, #444 0%, #111 100%);">This is a div with <strong>background</strong> first set to "background: blue;" and then set a second time to "-moz-linear-gradient(top, #444 0%, #111 100%);".<br>In DW CS6 Design view, this div renders incorrectly as solid white.<br>Expected behavior: this div should have a blue background in design view, ignoring the second background declaration.</div>

    </body>

    </html>

    Here’s the test file:

    http://dl.dropbox.com/u/29197/dw6-design-view-bug.html

    O
    osgood_
    Legend
    May 10, 2012

    Someone else posted an issue about CS6 displaying backgrounds incorrectly, so it may be a bug. I've not seen a lot of posts relating to this issue and by now I would have expected to do so if the problem is wide spread.

    http://forums.adobe.com/thread/1000474?tstart=30

    A
    ahdesignerAuthor
    Participating Frequently
    May 10, 2012

    I am wondering, if you can enable the view in the preferences. But after searching and testing I do think it is a bug. I was testing several Websites that have a background image in the "body" tag. As soon as there is a DIV with "no background" color the problem appears. Only in Dreamweaver CS6 design view the background is displayed whit instead of transparent. In the different broswers everything is viewed ok.

    Nancy OShea
    Community Expert
    Nancy OSheaCommunity Expert
    Community Expert
    May 10, 2012

    As a work around, try disabling CSS:   View > Style Rendering > un-tick display styles. 

    Or use a Design-Time Style Sheet with background-colors applied to divisions.

    http://help.adobe.com/en_US/dreamweaver/cs/using/WScbb6b82af5544594822510a94ae8d65-7e17a.html

    Nancy O.

    Nancy O'Shea— Product User & Community Expert
    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices