Video said do not touch layout.css, what then?

I was watching a video on the DW part of this site and the guy says no matter how tempting DO NOT edit the .css file made when creating the fluid grid (I called mine fluid-grid.css. He says DW's fluid grid component is too unstable so he makes his own .css file that he uses for editing once the basic grids are setup.
Okay here is my confusion. I have page1.html and fluid-grid.css saved from beginning of starting a new fluid grid. I've set up the fluid grid layout for each device, and entered basic un-styled content. Now I want to start adding styles and customizing things. Okay, I get it, don't touch fluid-grid.css in DW or bad things will happen. So what do I do to start making custom edits?
Do I copy and paste into a new .css file each sections that were automically created in fluid-grid.css and paste them into a new .css file custom.css? The sections I mean are (I don't paste everyting just the starting of each section I'm referring to:
/* Mobile Layout: 480px and below. */
.gridContainer {
    margin-left: auto;
    margin-right: auto;
    width: 97.3913%;
    padding-left: 1.3043%;
    padding-right: 1.3043%;
#Header {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: block;
/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
@media only screen and (min-width: 481px) {
.gridContainer {
    width: 91.4836%;
    padding-left: 0.7581%;
    padding-right: 0.7581%;
#Header {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: block;
/* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
@media only screen and (min-width: 769px) {
.gridContainer {
    width: 89.0217%;
    max-width: 1232px;
    padding-left: 0.4891%;
    padding-right: 0.4891%;
    margin: auto;
#Header {
    clear: both;
    float: left;
    margin-left: 0;
    width: 100%;
    display: block;
Do I take the section for mobile and paste it into mobile.css, the section for tablet and paste it into tablet.css and the section for desktop and paste it into desktop.css, or will pasting it all into 1 file called custom.css work too?
If the answer is yes, make the file or files, do I remove from the <head></head> of page1.html the original link to fluid-grid.css or does that stay no matter what?
Finally, I've read (and heard from videos) to do editing outside of the DW fluid grid feature. How do I exit the fluid grid feature? I always seem to be in it once I load the page1.html in DW.
Any help greatly appreciated.

Hi friedamee2,
Are you using latest DW 12.2 ?
I was watching a video on the DW part of this site and the guy says no matter how tempting DO NOT edit the .css file made when creating the fluid grid (I called mine fluid-grid.css. He says DW's fluid grid component is too unstable so he makes his own .css file that he uses for editing once the basic grids are setup.
Its a good practice not to edit the DW created properties in Fluid CSS as if updates are made to code created by DW it will fail to recognize the element as fluid.
I.e : if you are not touching or overriding these properties manually you are safe.
.gridContainer {
margin-left: auto;
margin-right: auto;
width: 97.3913%;
padding-left: 1.3043%;
padding-right: 1.3043%;
#abc {
clear: both;
float: left;
margin-left: 0;
width: 100%;
display: block;
.abc {
clear: both;
float: left;
margin-left: 0;
width: 100%;
display: block;
etc.
Okay here is my confusion. I have page1.html and fluid-grid.css saved from beginning of starting a new fluid grid. I've set up the fluid grid layout for each device, and entered basic un-styled content. Now I want to start adding styles and customizing things. Okay, I get it, don't touch fluid-grid.css in DW or bad things will happen. So what do I do to start making custom edits?
Ideal way will be to have one more CSS file with similar media query structure and then you can add you selectors and custom properties.
Do I take the section for mobile and paste it into mobile.css, the section for tablet and paste it into tablet.css and the section for desktop and paste it into desktop.css, or will pasting it all into 1 file called custom.css work too?
Please never copy and paste the whole thing from Fluid .CSS (DW created properties) as down the lane if you make changes to layout these changed properties will be overridden by the another set of properties in custom.css
Finally, I've read (and heard from videos) to do editing outside of the DW fluid grid feature. How do I exit the fluid grid feature? I always seem to be in it once I load the page1.html in DW.
I don't think so that its necessary,do let me know about any scenario where you feel the need to switch it off.
Although if you want to then just flip/uncheck the fluid grid aids in visual aids.
Kindly revert for any issues or concerns.
Cheers!,
Puneet

Similar Messages

Maybe you are looking for

  • File Adapter cannot read from Unix Directory

    Hello Everyone, I have created a Bpel process that should read txt files from a Unix directory, but its not doing its job. I have tried this process on windows and it works fine. I got the following error from the process log in my bpel console. my p

  • To set a dropdown list for one column in the excel file before downloading

    Hi all, I am downloading an excel file which has the format of an internal table with a number of fields. I want to set a dropdown list for one column in the excel file. How can i do this? Thanks

  • Need to double click to activate

    On my mac, in order to activate a link or other object, I need to click twice: once to select, then again to activate. Is there any way to be able to click on something and use it using only one click?

  • Hp officejet 7310 all in one scanning/faxing problems

    faxing and scanning will not work on my hp officejet 7310 all in one printer ... i have uninstalled and then re-installed, but still not working.... what am i doing wrong?

  • M:N Data relationships

    Hi, We have a data relationship which is causing headaches so any ideas how to solve this would be greatly appreciated. Customer Dimension Cust Code Cust Desc Account Dimension Acc Code Acc Desc Balance Facts Cust Code Acc Code Balance Data : Balance