Issues with class/id selectors

[absticles]

Hi there.

I'm having an issue with my class/id selectors.

This is the code I am currently using within the HTML.

<div id="my-login-bar">
<img class="logoutimage" src="img/icon-logout.png" />
<a class="loggingout" href="LOCATION">log out</a>
</div>

LOCATION is the equivalent of some PHP code I have in there.

In my CSS file the #my-login-bar has a position and width etc. However at the moment the image with the class .logoutimage sits too high beside the link. But when I change the margin-top or padding-top in the .logoutimage it also pushes around the link. And vice versa when I try altering the margin-top or padding-top in the class .loggingout for the link.

Can anyone help?

Thanks,
Abi

[almostbob]

margins, padding, doesnt work
try position relative to/from something fixed (in this example the bottom of my-login-bar)
something to try
my-login-bar is set for dimensions and position, elements inside my-login-bar can be set relative to my-login-bar

.logoutimage { top:auto;bottom:3px;left:3px;right:auto;}
.loggingout { top:auto;bottom:3px;left:auto;right:3px}

one is set relative to left bottom, the other set realtive to right bottom
to align the items just change anything not set "auto" and shift em round

Forget your classitis:

<div id="my-login-bar">
<img src="img/icon-logout.png" />
<a href="LOCATION">log out</a>
</div>

This just takes out all those presentation-only attributes - unless you're using them as hooks for js??

Using AB's CSS:

#my-login-bar img { top:auto;bottom:3px;left:3px;right:auto;}
#my-login-bar a { top:auto;bottom:3px;left:auto;right:3px}

[almostbob]

like it, v.clean (no wasted 'anything')

[absticles]

Thanks for the help, managed to fiddle with it a bit and got it working.

Great! Are we solved?