7 Replies Latest reply on Aug 1, 2008 1:23 AM by Newsgroup_User

    Css question

    mentlity Level 1
      I'm working on a site that has 7 pages, the site is designed from a template (not a DWT) in html and a style sheet attached to it.
      Lets call the originals html1 / css1
      the first page of the site is in html 1 and css1 ( I renamed both and made sure css attached correctly)
      the next 5 pages are almost the same but the css content is different so do I:
      edit page 2 based on html 2 and css 2 and rename css to css 2 ?
      edit page 3 based on html 3 and css 3 and remane to css 3? and so on.

      Funny cause I never stopped to look but if I use css.1 on 5 different pages based on the same layout but different dimensions for different content will each edited css style come up correctly or do I create a style sheet for each page and rename them for each page, follow?
        • 1. Re: Css question
          Level 7
          I would use css1 on all 5 pages, and add a link to another stylesheet below
          the link to css1. This will let that second stylesheet override the rules
          in css1, or add new rules as needed.

          --
          Murray --- ICQ 71997575
          Adobe Community Expert
          (If you *MUST* email me, don't LAUGH when you do so!)
          ==================
          http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
          http://www.dwfaq.com - DW FAQs, Tutorials & Resources
          ==================


          "mentlity" <webforumsuser@macromedia.com> wrote in message
          news:g6qr5h$1uv$1@forums.macromedia.com...
          > I'm working on a site that has 7 pages, the site is designed from a
          > template
          > (not a DWT) in html and a style sheet attached to it.
          > Lets call the originals html1 / css1
          > the first page of the site is in html 1 and css1 ( I renamed both and made
          > sure css attached correctly)
          > the next 5 pages are almost the same but the css content is different so
          > do I:
          > edit page 2 based on html 2 and css 2 and rename css to css 2 ?
          > edit page 3 based on html 3 and css 3 and remane to css 3? and so on.
          >
          > Funny cause I never stopped to look but if I use css.1 on 5 different
          > pages
          > based on the same layout but different dimensions for different content
          > will
          > each edited css style come up correctly or do I create a style sheet for
          > each
          > page and rename them for each page, follow?
          >

          • 2. Re: Css question
            Level 7
            Why not build a flexible page layout that has one common CSS for the entire
            site? Otherwise you will have 7 pages with 7 different CSS and when it
            comes time to change a link style you'll have to do it 7 times. That sort of
            defeats the whole point of having a global stylesheet.

            You can have page specific divisions or classes inside a stylesheet. For
            example, let's say you have a contact page and you want the text to be
            smaller and red on that page only.

            CSS:
            #contact {font-size:85%; color: red}

            HTML:
            <body id="contact">
            all the rest goes here
            </body>

            --Nancy O.
            Alt-Web Design & Publishing
            www.alt-web.com


            "mentlity" <webforumsuser@macromedia.com> wrote in message
            news:g6qr5h$1uv$1@forums.macromedia.com...
            > I'm working on a site that has 7 pages, the site is designed from a
            template
            > (not a DWT) in html and a style sheet attached to it.
            > Lets call the originals html1 / css1
            > the first page of the site is in html 1 and css1 ( I renamed both and
            made
            > sure css attached correctly)
            > the next 5 pages are almost the same but the css content is different so
            do I:
            > edit page 2 based on html 2 and css 2 and rename css to css 2 ?
            > edit page 3 based on html 3 and css 3 and remane to css 3? and so on.
            >
            > Funny cause I never stopped to look but if I use css.1 on 5 different
            pages
            > based on the same layout but different dimensions for different content
            will
            > each edited css style come up correctly or do I create a style sheet for
            each
            > page and rename them for each page, follow?
            >


            • 3. Re: Css question
              mentlity Level 1
              OK, I got my answers, I just wanted to make sure that I can use 1 style sheet for the whole project. So the css attached file will automatically display the contents in page 1 and even if the header and lets say the size of a footer is different on page 6 the same style sheet can be used for multiple pages. I gotta brush up on my css .

              rrr

              thx
              • 4. Re: Css question
                mentlity Level 1
                Still a bit confused, let me refresh here. I have a 7 page site to finish, pages 2 thru 5 are essentially the same page, only difference is the .flv in the content box. style sheet 1 is attached to those pages. Now the first page has a different layout with a flash swf and an image in the header. I see if I use the css sheet from pages 2 thru 5 then change the header size and content box to fit the first page it will change the layout in 2 thru 5 to the page 1 layout correct?

                So my other option would be to attach a different css sheet to page 1 and make the changes?
                Or, how can I use the css from pages 2 thru 5 for page 1 without messing up the style of pages 2 thru 5?

                By adding new rules for page 1?


                thx

                rsd
                • 5. Re: Css question
                  Level 7
                  > Still a bit confused, let me refresh here. I have a 7 page site to finish,
                  > pages 2 thru 5 are essentially the same page, only difference is the .flv
                  > in
                  > the content box.

                  That's the only difference? What content is on these pages?

                  > I see if I
                  > use the css sheet from pages 2 thru 5 then change the header size and
                  > content
                  > box to fit the first page it will change the layout in 2 thru 5 to the
                  > page 1
                  > layout correct?

                  If all the pages are linked only to that stylesheet, yes.

                  > Or, how can I use the css from pages 2 thru 5 for page 1 without messing
                  > up
                  > the style of pages 2 thru 5?

                  PAGE1 =

                  <html>
                  <head>
                  <title><title>
                  <link href="stylesheet1.css" type="text/css" rel="stylesheet">
                  <style type="text/css">
                  */ rules here to make page 1 have page 1's layout and to override the rules
                  in the linked stylesheet as necessary */
                  </style>
                  </head>
                  <body>
                  <!-- your body content goes here -->
                  </body>
                  </html>

                  --
                  Murray --- ICQ 71997575
                  Adobe Community Expert
                  (If you *MUST* email me, don't LAUGH when you do so!)
                  ==================
                  http://www.projectseven.com/go - DW FAQs, Tutorials & Resources
                  http://www.dwfaq.com - DW FAQs, Tutorials & Resources
                  ==================


                  "mentlity" <webforumsuser@macromedia.com> wrote in message
                  news:g6tmum$8ne$1@forums.macromedia.com...
                  > Still a bit confused, let me refresh here. I have a 7 page site to finish,
                  > pages 2 thru 5 are essentially the same page, only difference is the .flv
                  > in
                  > the content box. style sheet 1 is attached to those pages. Now the first
                  > page
                  > has a different layout with a flash swf and an image in the header. I see
                  > if I
                  > use the css sheet from pages 2 thru 5 then change the header size and
                  > content
                  > box to fit the first page it will change the layout in 2 thru 5 to the
                  > page 1
                  > layout correct?
                  >
                  > So my other option would be to attach a different css sheet to page 1 and
                  > make
                  > the changes?
                  > Or, how can I use the css from pages 2 thru 5 for page 1 without messing
                  > up
                  > the style of pages 2 thru 5?
                  >
                  > By adding new rules for page 1?
                  >
                  >
                  > thx
                  >
                  > rsd
                  >

                  • 6. Css question
                    mentlity Level 1
                    Got to be sure about this, I'm a designer. Tables and layers were simple but css is different. I should pick up a book so if someone has any articles or book / tutorial recommendations ?



                    Below is the head information for the css sheet attached to the pages in a site
                    The whole site is based off the style sheet” stylesheet1”

                    Question: I see the sheet’s location is in different locations on my drive. But the site is in a folder and the css attached sheet is in the same folder. Does it matter that the href is different on FILMEDIT.HTML?

                    Question: The last two pages RESUME and CONTACT have a different layout, in the head of those two pages can I attach another style sheet and link to the new one?
                    Putting the new css in the same folder as the other css sheet?

                    Or do this:


                    RESUME =

                    <html>
                    <head>
                    <title><title>
                    <link rel="stylesheet" type="text/css" href="stylesheet1/ stylesheet1.css" title="stylesheet1" media="screen,projection" />
                    MAKE NEW RULES*/ rules here to make page 1 have page 1's layout and to override the rules
                    in the linked stylesheet as necessary */
                    </style>
                    </head>
                    <body>
                    <!-- your body content goes here -->
                    </body>
                    </html>

                    Anything wrong with the script besides the css sheet is originally in two different locations?










                    FILMEDIT.HTML ****(same css different location)
                    <link rel="stylesheet" type="text/css" href=" stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik new/deesfolder/newsite/jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="jehshik new/Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">


                    CONTACT.HTML
                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">
                    <!—

                    TVEDIT.HTML
                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">
                    <!—










                    DOCEDIT.HTML
                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">


                    CAMERA.HTML
                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">
                    <!—








                    RESUME.HTML
                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">
                    <!—








                    HOME.HTML

                    <link rel="stylesheet" type="text/css" href="file:///Macintosh HD/Users/tuneraider/Desktop/ stylesheet1/ stylesheet1.css " title="andreas08" media="screen,projection" />
                    <title>THE WORK </title>
                    <link href="file:///Macintosh HD/Users/tuneraider/Desktop/stylesheet1/ stylesheet1.css" rel="stylesheet" type="text/css" />
                    <link href="jehshik.css" rel="stylesheet" type="text/css" />
                    <script src="../../Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
                    <style type="text/css">
                    <!--
                    • 7. Re: Css question
                      Level 7
                      On Fri, 1 Aug 2008 02:58:33 +0000 (UTC), "mentlity"
                      <webforumsuser@macromedia.com> wrote:

                      >Got to be sure about this, I'm a designer. Tables and layers were simple but
                      >css is different. I should pick up a book so if someone has any articles or
                      >book / tutorial recommendations ?
                      >

                      HTML,XHTML & CSS by Elizabeth Castro –
                      very comprehensive, readable and attractive book explains all - ( or
                      most at least )
                      http://www.cookwood.com/html6ed/contents/index.html

                      HTML Mastery - Semantics, Standards , and Styling by Paul Haine –
                      an excellent guide to how to really use html, including a
                      comprehensive guide to styling tables used for data.
                      http://www.friendsofed.com/book.html?isbn=9781590597651

                      CSS Mastery - Advance Web Standards Solutions - by Andy Budd –
                      an excellent companion to HTML Mastery - which really guides you into
                      using CSS correctly with valid code.
                      http://www.friendsofed.com/book.html?isbn=9781590596142

                      These two Mastery books compliment each other extremely well.


                      I got a little confused with your examples -

                      so the scheme I adopt is below:

                      I suggest use a separate folder for all style sheets - makes it easy
                      to find them. I call it /css !.

                      If you have a page that has yet more css, just add a third, forth one
                      etc. If only a few changes to css put them in the <head>


                      >
                      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
                      " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
                      <html xmlns=" http://www.w3.org/1999/xhtml">
                      <head>
                      <title></title>
                      <link href="css/stylesheet1.css" rel="stylesheet" type="text/css"
                      media="screen" />
                      <link href="css/stylesheet2.css" rel="stylesheet" type="text/css"
                      media="screen" />
                      <link href="css/print1.css" rel="stylesheet" type="text/css"
                      media="print" />

                      <!-- the additional/replacement styles are in stylesheet2 and
                      superceed those in stylesheet1 -->
                      <style type="text/css">
                      /* MAKE NEW RULES rules here to make page 2 have page 1's layout and
                      to
                      /* override the rules
                      /* in the linked stylesheet as necessary */

                      #page2 h1 {font-size:1.7em; }
                      /* give an id to a page in the <body> tag - and then in the
                      stylesheet1 or stylesheet2 use the above format for example to change
                      the size of the h1's */

                      </style>
                      </head>
                      <body id="page2">
                      <!-- your body content goes here -->

                      </body>
                      </html>
                      --

                      ~Malcolm~*...
                      ~*