hi, Just bought it yesterday. How do I edit my own css? there is no save button for css, i tried to write some lines but there is no changing in the css fille. How people use it usually? edit the css using other IDE?
thanks, minx
For editing the CSS you will find various ways to do this. This can be done via the Options Panel (new feature added a couple months ago) or directly in the Styles tab. You'll find that you cannot edit the default Bootstrap Styles as they are locked for a good reason, so that users can't accidentally break their sites totally without a way to go back to default. So if you want to create new CSS styles for your site or specific pages, do the following:
CSS Editing via the Styles Tab: 1. Right click over the word Styles in the section in the files list on the right. That will give you a right click menu. Choose to create a new style sheet. I name mine custom.css so that I always know which is mine. Too many of them like to call them styles.css or style.css so I stopped doing that. Name your to what you want it to be. 2. Double click that style sheet in the files list on the right. In the Styles window you will now see your custom style sheet as a tab. Click that tab to make it focused. 3. Inside the content area of the Styles pane, move your mouse around and you'll see that a blue thin line shows up at places. This means you can click that line and it will insert a place for you to add a new class or id. 4. I think if you play with the rest of the CSS setup for a class or ID it will become apparent how it's completed, but for the most part, brackets, colons and semi-colons are added for you, all you need to do is add the name of the attribute (which it has text sensitive settings to allow you to pick from a list of available ones as you type), then click Tab and it will tab to the attribute values for you to enter them.
That's simple enough to do and very similar to many editors for adding and editing CSS. To edit an already created class just click in that attribute value or name and it will act like any other text editor where you can edit the names of the class/id/attribute/values.
CSS Editing Via Styles menu using button dropdown. One thing to keep clear here is that the default custom file used for all newly added classes using the CREATE button, will be chosen automatically for you if you have not chosen one this session. This is the same in the Options Pane. So before you create any classes or ID's, be sure to choose which file you want it to go into. In the Styles window you will see a button called CREATE with an arrow on it. This will either Create a CSS class/ID in the default file being either the one you chose last for that session, or the first one in the list of Styles pages. If no default is chosen, it will automatically default to the first page in the Styles list alphabetically. Chosen defaults at this time are only session based so each time you start the program you will need to choose your default CSS file when editing your CSS and it will always remember the last one used until next session.
1. Click the arrow and you will see that it gives you the choice of any of your custom CSS files (not including the Bootstrap default files) and the choice to create a new CSS file. Choose to add it to the CSS file you want your class in. 2. This will then create the space for you to add a new class, many times it adds a full class depending on what you have highlighted in the preview pane so your class may already be created for you or you may need to delete part of it to simplify it more. 3. Edit as above in the instructions for editing the CSS via the Style window and you're all set.
Editing CSS via the Options Pane The Options pane in the top right has a tab with an artist pallette on it. This is the new CSS UI that allows you to edit the CSS via inline styling or by adding it or editing specific classes in your custom style sheets. Although there are times when inline styling is needed or easier, I would always suggest you choose a CSS page or class/id to edit by using the Style Attribute dropdown. If left on Style Attribute it will create inline CSS for the item you have selected in the Preview pane. When you click that dropdown it will give you the list of currently applied CSS styles to that item selected in the Preview pane as well as the ability to create a new CSS block. Choose the one that suits your needs and it will be created for you as well as giving you options in the CSS UI pane that can be edited.
This gives you a few options on how to edit your CSS in whatever way(s) suit your style of creation and editing.
Hope that helps and let us know if something isn't clear or you need more information.