Skip to main content
Participant
June 23, 2013
Answered

On Dreamweaver CC how do I get to the css rule definition box?

  • June 23, 2013
  • 8 replies
  • 41716 views

On the other Dreamweavers when I wanted to edit a css, I selected the css and clicked on the pencil icon to open the css rule definition box.

The only way I find to get acess to the css rule definition box on the new CC is when I am creating a new div and then there is a option for a new style and it opens the box.

My question is how do I get to the box once the rule is created? the pencil icon is not there anymore.

Not good breaking workflows Adobe, some folks have work in progress...

Please help, thanks.

https://dl.dropboxusercontent.com/u/105870069/img/ask.png

This topic has been closed for replies.
Correct answer sudarshan.t

The new CSS Designer in CC has a lot more features and has a different interface to that of the previous versions of DW.

To edit styles for a chosen selector, you need to first highlight the selector in the 'Selectors' panel. In your case, select '#wrapper' from Selectors panel first. Then, the 'Properties' panel below it will display all available customizations you can make to that selector.

8 replies

Inspiring
February 15, 2016

Oh My God !!!!!!!!!

What on earth have you done to dreamweaver. This new interface is not just a step backwards - its a running jump off a cliff backwards. I had to do a 10 minute fix and only had CC at hand. So it took hours - and thats with a lot of very smart people helping.

Who thought up this mess? Who allowed/insisted on these changes? Dont you ever watch real people using these products?

And as for the 'staff' who reply "read the manual" - are you kidding me? Has Adobe fallen so low its now comparable to a linux forum? Disgraceful!

Next time your car needs towing and your phonecall gets the same reply i'll laugh and laugh...

Mark Stoneham
Participant
February 5, 2016

Pressing Command + Option + Shift + P on my Mac used to work, but doesn't seem to any more. Very frustrating have to hard code for inline <> instead of using the CSS Rule dialog box.

Participating Frequently
February 5, 2016

Mark Stoneham wrote:

Pressing Command + Option + Shift + P on my Mac used to work, but doesn't seem to any more. Very frustrating have to hard code for inline <> instead of using the CSS Rule dialog box.

I am on a Windows machine not sure if this will work on Macs.

In Design view select the rule you want to change. On the Properties panel select the CSS button, then click Edit Rule, the old dialog box will pop-up

This is the only way I have found that makes this happen.

Mark Stoneham
Participant
February 5, 2016

Works on body, but not an inline style. Used to though.

Participant
August 2, 2015

To Nancy

I think you are not telling the truth, find one person who likes it, just one. I think you have just been told to say what you said and have no idea just how upset everyone is

I hate what you have done, WordPress in moving forwards and you are moving backwards
Its all about simplicity and not making your clients jump through hoops


I just hope adobe still allow me to download CS6 (which I cant find on the cloud) or I will cancel my membership and buy the old software second hand

Very annoyed
Nick Ray Ball

Nancy OShea
Community Expert
Community Expert
August 2, 2015

N_Ray007 wrote:

To Nancy

I hate what you have done, WordPress in moving forwards and you are moving backwards
Its all about simplicity and not making your clients jump through hoops

This is a user-to-user forum. I don't work for Adobe.  I have no input in Adobe's decision making. I'm just a product user like you.

With rare exceptions, very few Adobe employees spend time on this user forum. Unless you see an Adobe Staff badge by the person's name, you are being helped by an unpaid volunteer.

If you want to drop back to CS6, log-in to your Creative Cloud desktop app. Click on Filters & Versions > Click on Previous Versions.  You should see a drop-down list of versions: CS6, CC 2014.1, CC 2015.

Nancy O.

Nancy O'Shea— Product User & Community Expert
Known Participant
February 24, 2015

Oh thank GOD that I found this post!!!

The new css properties editor is one of the WORST updates ever made to software since - the only thing I can think of that comes close is the change from windows 7 to windows 8 and the removal of the start menu.

Adobe -- BRING BACK THE ORIGINAL CSS EDITOR - we pay your wages with our subscriptions. If the original editor is ever removed - I will have to start looking for other software.


Thanks to Jon Fritz II! It's not 100% the same as in cs6 - but its close enough until Adobe fix their mistake.

Nancy OShea
Community Expert
Community Expert
February 24, 2015

Many people actually like the CSS Designer.  But I understand change is hard.  Don't hold your breath for a return to the old panels.  I'm afraid that ship has sailed... 

DW has excellent CSS code hinting features in Code View. Have you tried it?  I prefer to work directly with code because it's so much faster than editing in panels.

Nancy O.

Nancy O'Shea— Product User & Community Expert
ALsp
Legend
September 1, 2015

Code View is the best way to edit or write CSS in Dreamweaver. It has been for a very long time. That said, the CSS Designer really sucks in terms of interface design. Actually, most Adobe interfaces tend to suck. There's a lot to be said for OS standard controls and UI elements, but I don't think Adobe gets that. The old CSS panel was a wicked-fast way to make quick changes. The CSS Designer is a leviathan and while David Powers claims it writes standard-based CSS I fear he is very wrong, or perhaps he doesn't care about verbose code :-) It sucks. So your answer of using code view is inarguably, the best answer.

sedesign
Known Participant
October 17, 2013

this workaround only seems available if you're working on the visual page... i cannot access the "edit rule" dialog when working strictly with the .css file... which was extremely helpful (tho yes, admittedly lazy and not brain-taxing). I cannot see the colours anymore... so when i'm tring to work quickly, i'm completely stymied... the properties panel does not seem to display the colour swatch like it used to for, say, background, or color properties. THIS IS NOT HELPFUL.

IS THERE SOMEWHERE i need to turn it ON?? or is this a bug?? (i'm using pc version, not mac)

i don't know about the rest of you, but i cannot memorize the hexcodes for 120 different designs... and what colour they actually are...

i really LIKED being able to SEE the colour in the properties box when editing the .css file...

please help. this is screwing with my workflow... hopefully i'm just missing something, and adobe didn't just arbitrarily get rid of that.

Participant
January 10, 2014

I agree, please bring back the CSS Rule Definition dialog box! At least make it an option in the preferences. I dislike having to click and unclick that "Show Set" thing too.

Jon Fritz
Community Expert
Community Expert
January 10, 2014

cknyght wrote:

I agree, please bring back the CSS Rule Definition dialog box! At least make it an option in the preferences. I dislike having to click and unclick that "Show Set" thing too.

It still exists in CC, though it's undocumented and may not stay.

Hit Ctrl + Alt +Shift + P and the CSS Designer will turn into the old CSS Panel.

Participant
June 25, 2013

I absolutely despise the new CSS Designer.  I just uninstalled CC and reverted to CS6.  It's awful.  Just awful.  Why wouldn't we just be given the option to use the properties box we've been using for so many years?

Also, I can't stand that certain interactions in CC applications require that I actually press down the physical button on my MacBook Pro trackpad.  Tapping won't work anymore.  I have to physically press down the button.  Why on earth would tapping functionality be altered?  That shouldn't even be allowed.  The OS-level settings should always override. 

Overall, very disappointed with some of the "enhancements" in the CC versions of the Adobe apps.

guptabhawna05
Adobe Employee
Adobe Employee
June 24, 2013

Please refer to the help document explaining the details on the new CSS Designer Panel.

http://helpx.adobe.com/dreamweaver/using/css-designer.html

Thanks

Bhawna

Participant
September 28, 2017

This answer is useless and doesn't answer the question. I strongly dislike the Css designer panel and prefer to use the edit using the "CSS Rule Definition dialog box".

sudarshan.t
sudarshan.tCorrect answer
Inspiring
June 24, 2013

The new CSS Designer in CC has a lot more features and has a different interface to that of the previous versions of DW.

To edit styles for a chosen selector, you need to first highlight the selector in the 'Selectors' panel. In your case, select '#wrapper' from Selectors panel first. Then, the 'Properties' panel below it will display all available customizations you can make to that selector.

Participant
June 24, 2013

Hi, thanks for the answer.

I get the new features and the minimal inferface design, my point is that the css rule definition box exists on Dreamweaver CC, by inserting a new div and chosing -> new style, ok it has a new interface, but it has no reason to remove acess to the css rule definition box once the rule is primary created.

Yes I can style the CSS on the Properties box and the changes are live, but do I have to change the way I work only because they want me too?

They didn´t remove the css rule definition box, they only removed the acess to it, and with that forcing me and maybe others to change the workflow.

What I want to know is if there is a way to call the css rule definition box, I tried on settings -> css the double click option and nothing.. double clicking on rule does nothing.

Participant
June 29, 2013

I'm thinking the fact that double clicking in the CSS Designer does NOT open the CSS Rule Definition box is a bug.

There is a workaround, even though it's a bit tedious to have to move your mouse across the whole screen instead of just double clicking.

Click on the rule you want to edit in CSS Designer, then on the left side of the property inspector (bottom of the screen), click 'Edit Rule'.

Voila, this will give you the CSS Rule Definition box.