19 Replies Latest reply on Feb 21, 2011 5:42 AM by MurraySummers

    WHY!?!?! Why do I have to make a CSS RULE with every Font Change

    KeyWestInc

      I am no major developer, but I have been using dreamweaver to build basic HTML sites for years. Just downloaded CS5 and I am ready to put my fist through the screen.

       

      I am creating a NEW HTML document. I dont know much about CSS so I am avoiding it.

       

      So I create a few tables, put text in the table, and go to change the attibutes like size, color, etc. Now I need to define it by making a CSS rule. Ok, perhaps I am a bit behind, but I selected a new HTML document, NOT CSS. Why do I have to define anything with CSS?

       

      Yes, this is a basic basic thing I am trying to do. For years if I wanted to change the color, size, position, etc of some simply text in DW, it would just do it. I would never be asked to make a rule.

       

      What is frusterating me is that I am making a rule, adjusting text, I can partially live with that. But now it is changing the attributes of text on the other wide of the page in a different table because it had similar attributes.

       

       

      How do I go back to old school html, stright forward, no CSS.

       

      thanks!
      Jason

        • 1. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
          Ben M Adobe Community Professional

          KeyWestInc wrote:

           

          I am no major developer, but I have been using dreamweaver to build basic HTML sites for years. Just downloaded CS5 and I am ready to put my fist through the screen.

           

          I am creating a NEW HTML document. I dont know much about CSS so I am avoiding it.

           

          So I create a few tables, put text in the table, and go to change the attibutes like size, color, etc. Now I need to define it by making a CSS rule. Ok, perhaps I am a bit behind, but I selected a new HTML document, NOT CSS. Why do I have to define anything with CSS?

           

          Yes, this is a basic basic thing I am trying to do. For years if I wanted to change the color, size, position, etc of some simply text in DW, it would just do it. I would never be asked to make a rule.

           

          What is frusterating me is that I am making a rule, adjusting text, I can partially live with that. But now it is changing the attributes of text on the other wide of the page in a different table because it had similar attributes.

           

           

          How do I go back to old school html, stright forward, no CSS.

           

          thanks!
          Jason

          This question comes up a lot and it always interests me.  If you choose a profession, why would you choose something you don't want to continue learning about?  Would you be mad if your mechanic wouldn't repair your hybrid car engines because they only want to work on engines from the muscle cars of the 60s and 70s?  Or would you prefer a doctor only give you penicillin for everything because they don't want to learn about the modern advances in medicine? It just doesn't make sense.

           

          Best advise I can give you is that CSS is the way all web browsers and email clients are going whether through the use of attached style sheets with defined styles, or with inline styles for email security reasons.  CSS is the styling for anything web based.  Even if you are not in a CSS document, HTML pages use CSS to render styles from colors and margins to borders and backgrounds.  Then if you use a rule over and over you don't have to click through this color and that size and that underline with this font.  You just select a style where you want it and keep going.  The learning is worth the time invested.

           

          http://w3schools.com/css/default.asp

          1 person found this helpful
          • 2. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
            Nancy OShea Adobe Community Professional & MVP
            How do I go back to old school html, stright forward, no CSS.

             

            You get into your time machine and go back about 10-15 years.

             

            Seriously, you're not doing yourself or your clients any good by clinging to past/bad practices.

            CSS is more efficient than tables for layouts and it affords much more flexibility than HTML styles.

             

             

             

            Nancy O.
            Alt-Web Design & Publishing
            Web | Graphics | Print | Media  Specialists 
            http://alt-web.com/
            http://twitter.com/altweb

            1 person found this helpful
            • 3. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
              KeyWestInc Level 1

              I hear what you are saying. I am open to learning it. I undestand that naming a style will save time, etc. No problem.

               

              Just frusterating to select different parts of a page, change the attributes, and something on the other side of the page changes. It just doesnt click with me since I am selecting one section and something else changes. Its like opening the front door to my house and all the windows, back door, and garage open at the same time. I dont want or need everything to open

               

              is this a simple fix?

              • 4. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                Nancy OShea Adobe Community Professional & MVP

                Yes.  Learn how CSS works.  Cascading styles cascade to other parts of the page unless you specify with an #ID or .class name.

                 

                Example CSS

                 

                p {font-size:12px}

                 

                .special p {font-size: 25px}

                 

                 

                HTML:

                <p> Every paragraph will have 12px text</p>

                <p class="special"> Only this paragraph will have 25px text</p>

                 

                 

                Nancy O.
                Alt-Web Design & Publishing
                Web | Graphics | Print | Media  Specialists 
                http://alt-web.com/
                http://twitter.com/altweb

                • 5. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                  TLL... Level 3

                  Boy do I feel your pain. Upgraded from CS3 to CS5 Master Collection (no, didn't keep CS3 on the machine for a crap load of reasons). I do very simple HTML page work most of the time and was just getting up to speed with CSS and all in CS3. But I always had that nice ability to change up fonts, sizes and such via the HTML attributes menu.

                   

                  Imagine my surprise just last night when I first opened up CS5 to modify some HTML auction pages created in Photoshop (sliced up imagery). I opened an old (non CSS) HTML page make in DW CS3, pasted it on top of my image slices and want to changes some type. I highlight some text and - where's the simple select font or change size or color? It's all gone! So much for intuitive web design.

                   

                  These GUI "change for change sake" changes drive an old fart like me crazy in Photoshop, so I guess its no surprise it turns up in other Adobe apps.

                   

                  Maybe I'll need to reload FrontPage for simple web page work...

                  • 6. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                    Nancy OShea Adobe Community Professional & MVP

                    These GUI "change for change sake" changes drive an old fart like me crazy

                     

                    In DW, the changes were not for "change sake."  They were made to support current W3C web standards.

                     

                    The CS5 interface has 2 properties panels now: one for HTML and the other for CSS.  Click on the CSS tab to style your text.

                     

                     

                    Nancy O.
                    Alt-Web Design & Publishing
                    Web | Graphics | Print | Media  Specialists 
                    http://alt-web.com/
                    http://twitter.com/altweb

                    • 7. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                      KeyWestInc Level 1

                      Ok, any issues using templates in DW? When I am creating a new html doc from a template,

                      I am running into situations where adjusting certain css is "blocked".

                      • 8. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                        Ben M Adobe Community Professional

                        Check your code view for an editable region in the <head> of your document.  If it there is not one there, insert one and name it "head".  DW has a few predefined editable regions that it looks for and if it is not there it can cause the symptom you describe.

                        • 9. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                          Nancy OShea Adobe Community Professional & MVP

                          I hate .dwt files.  They make things harder rather than easier for almost everyone who posts here (except Murray who wrote the book on them).   I don't mean to go off on a rant about Templates.  Use them if you need to.  But understand how they work.

                           

                          Your main Template.dwt file is the one that contains Editable Regions.  Anything that relies on supporting Scripts & CSS files (Spry Widgets, for example) must be able to write to an Editable Region inside the <head> tags. If this is missing or nested incorrectly, you can't add/edit CSS or Scripts while working on child pages.

                           

                          Incidentally, I rarely use Templates.  I think Server-Side Includes are much better.

                           

                           

                           

                           

                          Nancy O.
                          Alt-Web Design & Publishing
                          Web | Graphics | Print | Media  Specialists 
                          http://alt-web.com/
                          http://twitter.com/altweb

                          • 10. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                            phreaddee123

                             

                            How do I go back to old school html, stright forward, no CSS.

                             

                             

                            the irony of this statement is very amusing. as by using css it gives you straight forward html and separates style from markup and by doing it the table way with inline styles, you are actually using css in the html and makes it several times more difficult to change, edit, and remove things.

                             

                            unless your page uses browser defaults only, it is impossible to avoid css, so it is best to learn it.

                            • 11. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                              KeyWestInc Level 1

                              I am learning css now and getting by. Much of my html work these days are ebay listings and craigslists ads. craigs has very limited use for css and generally allows only basic html. I just dont have much need for it, but if it is whats standard, I will learn it.

                               

                              I am understanding the code now, which makes editing it individually much easier in DW.

                              • 12. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                davidjer

                                Don't avoid CSS!   It's SO simple and the best way to go. If you want all your type to be a certain way for the whole page just create a CSS rule for the body tag. you can do this automatically by:   Modify/Page Properties/ Type. Dreamweaver will automatically create a Body Tag style. This will then be the default for the page. then you can adjust the type specifications for different parts of the page by making CSS rules for each Div tag or Table which contains the text.  Do this by selecting the table or Div Tag, click on the CSS icon: Whatever you selected will show up in the CSS dialogue box. Click on "New CSS rule" and you're on your way. (select the "type" category)     Or you can create a class style, with the type specifications that you want, select the text that you want to apply these specifications to, and use the property inspector to apply this class to that text.   CSS is the way to go and once you understand it you will never go back.     You can also select text, and then in the property inspector format it as "paragraph", Heading1, heading2, etc. and then create a tag CSS for "paragraph, heading1, heading2, etc.  Whatever you specify in the CSS rule for, say for instance, Heading1, will apply to any text on the page that you formatted as "Heading1".  I know this sounds a bit complicating but try it! you'll like it!

                                • 13. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                  james2483 Level 1

                                  After reading your link SSI's seem alot more versatile.

                                   

                                  The only thing I worry about with them is if the html is very different on each page the overall effect it will have on each layout.

                                  • 14. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                    Nancy OShea Adobe Community Professional & MVP

                                    james2483 wrote:

                                     

                                    After reading your link SSI's seem alot more versatile.

                                     

                                    The only thing I worry about with them is if the html is very different on each page the overall effect it will have on each layout.

                                     

                                    Include files contain unstyled snippets of code, usually links and text only. The parent page contains all the structure, styles and scripts.  So SSIs alone won't harm your layout. And they are a HUGE time saver.

                                     

                                    More on SSI
                                    http://forums.adobe.com/message/2112460#2112460

                                     

                                     

                                     

                                    Nancy O.
                                    Alt-Web Design & Publishing
                                    Web | Graphics | Print | Media  Specialists 
                                    http://alt-web.com/
                                    http://twitter.com/altweb

                                    • 15. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                      Nini Tjader Level 4

                                      That link about SSI files says "You cannot use include files in HTM or HTML files, you can                      use them only in SHTML, ASP, PHP pages, etc. - that support                      include files." So you actually cannot use them if the hostfile where you want to insert it is a html document, right? Can the SSI file be a regular html document? or does it have to be something else? If you do NOT want to use SHTML, ASP or PHP pages, what solutions are there then to obtain the same results that you could/can easily do with a Component in GoLive when you don't want to change something manually on each page but only in one place/file?

                                      • 16. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                        MurraySummers Level 8

                                        For include files to work, the host server has to parse the requested page to find the include directives.  Of course, this parsing happens automatically on PHP or ASP, etc. files, but on normal HTML files with a filename of *.htm(l), it does not. To make it work, you would either have to a) rename the files with *.shtm(l) extensions, or b) configure the host server to parse ALL files regardless of filename.

                                         

                                        The included file itself can be plain HTML or any other scripting language.

                                         

                                        My standard procedure now is to name ALL files with a PHP extension, whether they contain PHP or not (and this includes the include file fragments), because I know that at some point in the future, I may want to add PHP to them.

                                        • 17. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                          james2483 Level 1

                                          Ahhh Ill have to look in to it more I think, at the moment a bit confused lol

                                           

                                          I think Murray's idea of naming each page with a  php extension makes alot of sense, something I may now adapt....if I ever quite figure out php lol

                                          • 18. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                            NightAvatar

                                            I hate to be an *** - especially since I'm kinda new to this forum.

                                             

                                            But I want to point out that Nancy O's example code is (barely) incorrect. The correct code for what she's trying to show would be:

                                             

                                            NOT

                                             

                                            .special p {font-size: 25px}

                                             

                                            BUT

                                             

                                            p.special {font-size: 25px}

                                             

                                            /*(move the P to before the class name).*/

                                             

                                            The only reason I bother is becuase some poor soul may find this thread through Google or something months from now and get frustrated when your code doesn't work for them.

                                             

                                            Otherwise, I agree with pretty much everything that's been said here regarding the importance of using CSS rather than outdated HTML practices.

                                            • 19. Re: WHY!?!?! Why do I have to make a CSS RULE with every Font Change
                                              MurraySummers Level 8

                                              Yep.  Good catch.  Thanks for clarifying.