Scroll To Top

Enter a query to search our site. Note that you can use "*" and "?" as wildcards. Enclosing more than one word in double quotes ("CSS Layout") will search for the exact phrase.

Buy Now ($35: Includes PVII DT CSS and PVII Server Side Includes)

PVII Design Time CSS PVII: the leader in Responsive Tools for Dreamweaver

PVII Design Time CSS can be installed in Dreamweaver versions CS5.5 to CC 2015 (and later).

Dreamweaver Design View does not support modern CSS standards very well sometimes. To work around some of the more egregious shortcomings, You can use Design Time style sheets. The only problem is that Adobe removed this feature in Dreamweaver version CC 2015, which is why we have given you a means to restore this feature!

What Do Design Time Style Sheets Do?

Because of Dreamweaver's lack of support for certain modern CSS properties in Design View, editing the content of your page can be difficult, or impossible, in Design View. Design Time CSS enables you to link a CSS file to your Dreamweaver page that is only utilized in Design View. It has no effect on how your web page looks in a browser, and it does not have to be uploaded to your web server.

As an example, let's say that because you use modern box-model CSS, one or more of your columns do not appear properly. While they are set to float, side by side, on or more of them drops to a new line, making it difficult to edit or sometimes even see your content. You can use a Design Time CSS file to set your columns to float: none, thereby linearizing them and making them easy to access and edit content. Your columns will still display properly in a browser, but your content will now be easy to edit!

Using Design Time CSS

To use PVII Design Time CSS, choose: Commands > Design-time Stye Sheets

The Design-Time Style Sheets window will open.

Click the plus sign above the Show only at design time box and browse to the style sheet you wish to use. In most cases you will want to Show Only at Design-Time.

Click OK

This needs to be done for each page you want to "fix".

Tips

If you're familiar with this feature and have just been waiting for us to restore what Adobe removed, then you already know how to write a design time style sheet. If you are new to this feature, here is what we have in the design time CSS file for the PVII home page:

.content-block div {
float: none !important;
width: auto !important;
}

This simple rule makes it easy to use modern CSS and have our page easy to edit content in design view. You might need other rules for your pages. If you need guidance, please feel free to log on to our forum and ask for assistance.