Css 'top' Property Has No Effect

I'm just starting with CSS and would like to understand some behaviors. I have this defined in a CSS file: #spa { position : absolute; top : 8px; left : 8px; bottom : 8p

Solution 1:

Simply because neither .spa-shell-head-logo nor .spa-shell-head-acct divs are positioned.

CSS top, right, bottom and left (offset) properties are only applicable to non-staticpositioned elements - i.e. elements have a position other than static (fixed, absolute, relative).

For instance, give them a position of relative to see the effect - Example.

Solution 2:

Top, Left, Bottom and Right property works depending upon the position. It absolutely work with when you assign position property to absolute/fixed.

Solution 3:

the properties of top, left, right, and bottom, will only work if you have declared the positions of the elements you are using the tags with as position absolute, or fixed. otherwise you will want to use margining.

as a side note, it will be very beneficial for you to try and keep all of your css in the same place. Once you start adding more css, it will likely become confusing!

hope this helps.