External CSS ID selector not working

Hey guys I have an external CSS and HTML file, I am currently trying to link the two, more specifically I am trying to link the ids that are titleImage titleLink and webpageTitle. Unfortunately the CSS for does not seem to register. I have tried switching the position of the type and the id such as instead of this, #titleImage img that did not work. Is it an issue with me having multiple external CSS references? Also this is not all the code there is more to each but the ones listed below are the parts that I focus on the most. I have also tried removing the a, img, h1

So could someone explain why titleImage titleLink and webpageTitle styles are not registering on my localhost?

UPCDATE: I have made change to reflect everyone's comments below and the site is still not updating with the new css as listed in the code below in style.css

style.css

div#titleImage {
    position:absolute;
    top:0px;
    right:0em;
    }
a#titleLink { text-decoration: none}

h1#webpageTitle {
    position:relative;
   }

HTML file

 <head>
    <link href='http://fonts.googleapis.com/css?family=Alef:400,700|Roboto+Slab'  rel='stylesheet' type='text/css'>

    <!-- Bootstrap core CSS -->
    <link href="/css/bootstrap.css" rel="stylesheet">
    <!-- Custom styles for this template -->

    <link href="/css/sticky-footer-navbar.css" rel="stylesheet">
    <link href="/css/style.css" rel="stylesheet" type="text/css">
    <link href="/css/lightbox.css" rel="stylesheet">
  </head>

<body>
    <section class="container">
        <header class="row" id="header">
        <!-- Begin grid -->
            <div class="col-sm-9"><!--Top of the page-->
                <a href="/" id="titleLink" style="color:#000000"><h1 id="webpageTitle">McMaster SEClub</h1></a>
            <div id="titleImage"><img src="/img/logo.gif" width=150 height=110></div>
        </div>

Solution

The titleImage ID is for the <div> surrounding the image, not the image itself. At the moment, you are trying to find an element with a #titleImage selector inside an image tag.

For the titleLink, the ID is the element, so you can do this instead:

a#titleLink { ... }

However, you'd typically only have one ID on a page, so you could just target the title link by doing this:

#titleLink { ... }

The webpage title should be working as intended. However, I'd still recommend just using the ID. An element with relative positioning doesn't really appear different unless you've given it some style declarations:

#webpageTitle {
    position: relative;
    top: 10px;
    left: 10px;
}

Hope that helps.