CSS just won't apply to DIV tag

I used Artisteer to build the following Joomla 2.5 template (http://upgrade.rosmini.school.nz/). I needed to add an extra position called #icon-menu. I have done this but for some reason none for the icon-menu css is being applied to the div tag. When I inspect the element via Chrome, I can’t see the CSS being used of overwritten anywhere. Its been a while since I’ve worked on CSS so am sure that I am overlooking something very obvious… but just can’t see what.

      <div class="ros-header">
        <?php if ($view->containsModules('position-0')) : ?>
        	<div class="icon-menu"><?php echo $view->position('position-0'); ?></div>
        <?php endif; ?>
        <div class="ros-headerobject"></div>
        <div class="ros-logo">
          <h1 class="ros-logo-name"><a href="<?php echo $document->baseurl; ?>/"><?php echo $this->params->get('siteTitle'); ?></a></h1>
          <h2 class="ros-logo-text"><?php echo $this->params->get('siteSlogan'); ?></h2>
        </div>
      </div>

#icon-menu {
	position: absolute;
	top: 12px;
	display:block;
	left: 500px;
}

Hi,

You have used a class in the html but used an id in the css:)


#icon-menu {
	position: absolute;
	top: 12px;
	display:block;
	left: 500px;
}

It should be:


.icon-menu {
	position: absolute;
	top: 12px;
	left: 500px;
}

Twit that I am… I knew that it was something simple… very embarrassing, but thanks :slight_smile:

No worries - we all do it at some time :slight_smile: