SitePoint Sponsor

User Tag List

Results 1 to 18 of 18

Thread: learning css

  1. #1
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    learning css

    I'm following the absolute beginner's guide of html and css. The HTML part was a success , did what was told exactly in the CSS but did not turn out on my HTML pages as it is supposed to. Any help, suggestions will be much appreciated Thanks.

  2. #2
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh and incidentally it is external style css

  3. #3
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Do you mean the SP Blog post written Ian Lloyd or something else. Without knowing exactly what you are referring to it's a little hard to determine. Have you a page link to the tutorial? Or do you mean you have brought a Book and if so what is it's correct title.

    If it's external CSS then the odds are your file name link in the markup or extension for CSS file are wrong. In which case we'd need to see a code sample of what you wrote.

  4. #4
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    yes that's the blog post I'm referring to.
    <head>

    <title>Bubbling Leagues-the diving club in the Northwest.</title>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    <title>First CSS Tutorial</title>

    <link href="style1.css" rel="stylesheet" type="text/css"/>

    </head> this is in the index and other pages
    /*
    CSS for Bubbling League site
    */ <br>
    p { <br>
    font-weight: bold;
    color: blue;
    } this is in my external sheet named style1.css

    All other code is as it should be just not copied and to note I named it slightly differently according to where I'm from.

  5. #5
    SitePoint Wizard
    Join Date
    Jul 2003
    Location
    Kent
    Posts
    1,921
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    No doctype in the code you posted.

  6. #6
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    I suspect you were referring to the following: Learn HTML and CSS: An Absolute Beginner’s Guide Article SitePoint which page out of those 19 are you on at the moment?

    You should NOT have markup within the CSS file called style1.css

    The CSS might say the following?

    Code:
    p { 
     font-weight: bold; 
     color: blue; 
    }
    Though it certainly won't have any BR in the CSS file so that's at least one problem you have.

    Furthermore you should only have one TITLE for the page not two.

    But I need to know what page you are on first... Because you only have copy-and-pasted the HEAD part of the markup.

  7. #7
    SitePoint Enthusiast Bhjorth's Avatar
    Join Date
    Mar 2011
    Posts
    31
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <!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>Bubbling Leagues-the diving club in the Northwest.</title>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    
    <link href="style1.css" rel="stylesheet" type="text/css"/>
    
    </head>
    style1.css
    Code:
    /* CSS for Bubbling League site  */  
     p {             
             font-weight: bold;              
             color: blue;               
            }
    Try making the code as this, remember you have to put a </html> in the end.

    Do you have the <body></body> ?

  8. #8
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 //EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <html>

    <head>

    <title>Bubbling Leagues-the diving club in the Northwest.</title>

    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
    <title>First CSS Tutorial</title>

    <link href="style1.css" rel="stylesheet" type="text/css"/>

    </head>
    <!--learning HTML and CSS by codes hopefully with the CSS attaching to HTML for I am not sure I have in my other site-->
    <ul> <br>
    <li><a href="index.html">Home</a></li> <br>
    <li><a href="about.html">About Us</a></li> <br>
    <li><a href="contact.html">Contact Us</a></li> <br>
    </ul> <body>
    <div id="header">
    <div id="sitebranding">

    <h1>BubblingLeagues.com</h1>
    </div>
    <div id="tagline">

    <p>This is a club for divers that love to dive in the depths of water to explore its great wonders.</p></div>
    </div> <!--end of header div-->
    <div id="body content">

    <h2>Welcome to Bubbling Leagues!</h2>
    <p><img src="divers-circle.jpg" alt="a circle of divers practice their skills" width="200" height="162"/>

    <p>Glad you could drop in and share some air with us! You've

    passed your underwater navigation skills <br>and successfully

    found your way to the start point -
    or in this case, our

    home page.</p>


    </div> <!--end of body content div-->
    <br>

    </body>

    </html>

    It is all there I just didn't paste it in my previous thread.
    Thank you

  9. #9
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    And also this is the index (home) page. All others have the proper code.

  10. #10
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    You still haven't told me which page you are on yet?

    You have all your code muddled up with erroneous BR all over. The BODY in the wrong place, too many titles... That I do know.

    Therefore I cannot tell what it is supposed to actually look like but I suspect by just guessing:

    Code HTML4Strict:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
      <head>
        <meta http-equiv="Content-Type" content=
        "text/html; charset=UTF-8" />
        <title>
          Bubbling Leagues-the diving club in the Northwest.
        </title>
        <link href="style1.css" rel="stylesheet" type="text/css" />
      </head>
      <body>
        <!--learning HTML and CSS by codes hopefully with the CSS attaching to HTML for I am not sure I have in my other site-->
        <ul>
          <li>
            <a href="index.html">Home</a>
          </li>
          <li>
            <a href="about.html">About Us</a>
          </li>
          <li>
            <a href="contact.html">Contact Us</a>
          </li>
        </ul>
        <div id="header">
          <div id="sitebranding">
            <h1>
              BubblingLeagues.com
            </h1>
          </div>
          <div id="tagline">
            <p>
              This is a club for divers that love to dive in the
              depths of water to explore its great wonders.
            </p>
          </div>
        </div><!--end of header div-->
        <div id="bodycontent">
          <h2>
            Welcome to Bubbling Leagues!
          </h2>
          <p>
            <img src="divers-circle.jpg" alt=
            "a circle of divers practice their skills" width="200"
            height="162" />
          </p>
          <p>
            Glad you could drop in and share some air with us! You've
            passed your underwater navigation skills and successfully
            found your way to the start point - or in this case, our
            home page.
          </p>
        </div><!--end of body content div-->
      </body>
    </html>
    The above code I sorted for errors (from what you posted above and nothing else) it might work?

    I am working blind here... I am an very slow connection so do not really have the time to wade through 19 pages to get to the correct one.

    That is why I am asking to save us both time, regarding which page you are on?
    Last edited by Force Flow; Jun 30, 2011 at 14:42. Reason: revision at xhtmlcoder's request

  11. #11
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I am soo sorry I misunderstood you. It is page 13 the paragraphs and/or words that were supposed to have change colors did not change.
    Thank you, and again I apologize,
    Gayle

  12. #12
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Also, I'll take care of the BR

  13. #13
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    No worries it saved me looking through 12 pages...

    Like you said you aren't following the exact same page structure, which is fine. So long as it doesn't deviate too much or some or the CSS won't apply itself correctly unless you match the ID and class values to your version, etc.

    I see you'll need to change your <div id="body content"> into <div id="bodycontent"> that ID is one word NOT two so you'll also have to fix that.

    I assume when you tried inline CSS in the previous examples that worked?

    If so, once you have cleaned up the markup we now have to determine whether it's your CSS content that is wrong or your link to the CSS file?

    Make sure your CSS file is called style1.css and that is has the *.css extension and NOT *.txt

    If you create a NEW CSS file called style1.css (only using the CSS from my post #6). You'll have a good CSS file.

    Then using my XHTML sample code in #10 and save that (index.html) you will then have webpage. Then hopefully the linked CSS file WILL apply blue paragraph text to your page.

    Make sure both: index.html and style1.css are in the same folder.

    Try that first, and once we get that working we can move forward... If it doesn't then you are probably make typos in the filenames.

  14. #14
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you so much. I should have known that it was the <br> tags but didn't with the body content being spaced would have an effect.
    Last edited by livingmydream; Jul 6, 2011 at 15:14. Reason: to give thanks to someone who helped me

  15. #15
    SitePoint Wizard bronze trophy Black Max's Avatar
    Join Date
    Apr 2007
    Posts
    4,029
    Mentioned
    12 Post(s)
    Tagged
    0 Thread(s)
    Stunning Boy, we call that "thread hijacking" around here. We're glad to give assistance, but please don't horn in on someone else's thread with your own requests. Start a new thread, please. Thanks.

  16. #16
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I apologize for that did mean to do that. I was just following a link from my email. Won't happen again.

  17. #17
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Off Topic:

    What are you apologising for livingmydream, did you make a typo in #17 and edited your post later? Because Max was talking about the other user that started a different topic in your thread.

  18. #18
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    10
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just simply disregard that. Didn't realize it was directed at another user.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •