Community
    • Login

    Need Help Linking My CSS to HTML!

    Scheduled Pinned Locked Moved Help wanted · · · – – – · · ·
    3 Posts 2 Posters 4.6k Views
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • Jd JonesJ
      Jd Jones
      last edited by

      I can’t seem to connect my CSS to my HTML
      Here is my HTML:
      …
      <!DOCTYPE html>
      <html>

      <head>
      <meta charset=“UTF-8”>
      <link rel=“stylesheet” type=“text/css” href=“styles/style.css”>
      </head>

      <body>
      <title>Week 3 Work</title>

      <header>
      <img src=“images/logo.png” alt=“logo” class=“fullWidthContent”>
      <a>

      <h1>Fictional Company Ltd.</h1>

      </a class=“inlineheader”>

      </header>

      <nav>

      <ul>
      <li><a href=“index.html” alt= “Link to Home”>
      Home
      </a></li>
      <li><a href=“team.html” alt= “Link to Meet The Team”>
      Meet The Team
      </a></li>
      <li><a href=“products.html” alt= “Link to Products”>
      Products
      </a></li>
      </ul>

      </nav>

      <main>
      <p>This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.This is some text.<p>

      <table>
      <caption>Fictional Company Earnings</caption>
      <tr>
      <th>2013 Profits</th>
      <th>2014 Profits</th>
      <th>2015 Expected Profits</th>
      </tr>
      <tr>
      <td>10 Million</td>
      <td>20 Million</td>
      <td>100+ Million</td>
      </tr>
      </table>
      </main>

      <footer>
      <p>Copyright Some Company 2015</p>
      </footer>

      </body>
      </html>
      …
      Here is my CSS
      …
      body
      {
      font-family:verdana;
      }
      header
      {
      background-color:#B2B2B2;
      padding:10px;
      }
      #inlindheader
      {
      display:inline;
      text-align:right;
      color:white;
      font-size:30px;
      }
      nav
      {
      background-color:black
      padding:5px;
      }
      nav ul li
      {
      list-style-type:none;
      background-color:#B2B2B2;
      display:inline;
      padding:15px;
      }
      nav ul li a
      {
      color:white;
      text-decoration:none;
      }
      nav ul li:hover
      {
      background-color:#8E8E8E;
      }
      footer
      {
      padding:10px;
      background-color:black;
      }
      footer p
      {
      text-align:center;
      color:white;
      }
      table
      {
      width:100%;
      border:1px solid black;
      border-collapse:collapse;
      font-size:20px;
      margin:20px;
      }
      th,tr,td
      {
      border:1px solid black;
      text-align:left;
      }
      …
      the name of my css is “style.css”
      the name of my htlm is “index.html”
      sorry if my code isnt tidy as im a beginner.
      Thank you!

      Claudia FrankC 1 Reply Last reply Reply Quote 0
      • Claudia FrankC
        Claudia Frank @Jd Jones
        last edited by

        Hello @Jd-Jones,

        this is an notepad++ forum, so questions regarding npp are normally our target.
        You do have a html/css question which might be better addressed to such forums.
        In regards to your question, you did take care that the directory where index.html is
        has a subdirectory called styles and in this subdirectory there is the style.css?

        Cheers
        Claudia

        1 Reply Last reply Reply Quote 1
        • Jd JonesJ
          Jd Jones
          last edited by

          I’m using Notepad++, Thank you I got it now, I forgot to put the style in the styles directory, it works fine now! Thank you so much!

          1 Reply Last reply Reply Quote 0
          • First post
            Last post
          The Community of users of the Notepad++ text editor.
          Powered by NodeBB | Contributors