CSS selector not working in CakePHP when trying to style an image/div

I've recently installed CakePHP and this is my first time using it.

I'm creating a vertical navigation bar that will have a square logo on top. I need to be able to resize this logo. However, I cannot for the life of me seem to be able to select the corresponding div.

HTML

<nav>
    <div id="my-logo">
            <?= $this->Html->image("Company_Logo.png") ?>
    </div>
    <ul class="nav nav-pills nav-stacked span2">
        <li><a href="#">Home</a></li>
        <li><a href="#">About</a></li>
        <li><a href="#">Services</a></li>
    </ul>
</nav>

CSS

#my-logo {
width: 256px;
height: 256px;
display: block;

}

In theory using a unique ID should work if all else fails, however, that isn't working either. I've also tried using a CSS class, descendants, etc.

When I inspect the image in a browser I find out that it's being controlled by base.css (I've been writing my CSS in cake.css, both files are included in the HTML page).

  img {
  display: inline-block;
  vertical-align: middle;
  }

I can modify this fine to resize the logo, so my conclusion is that it's over-writing my ID - but doesn't that go against the specificity principle of CSS?

I've searched to see if it's something to do with CakePHP, but haven't come up with answers.

What's going on here?