Grow your CSS skills. Land your dream job.

Background Position: center center;

  • # July 4, 2012 at 2:49 pm

    I know what the first center declaration is for, I think it is to tell css that just the central part of an image should appear (Nothing else that belongs to that same image, ryt?)… What 2nd center is for?

    And what what does this mean?
    ul#nav li a{
    height:65px;
    text-indent: -9999px;
    float:left;
    }

    I actualy understand what this actualy means, But kinda doesn’t make sense, here we r telling css to move text away from the screen, ryt? If links themselves are not on the screen then how would css and html know at part of the image we r clicking, and what that click should do? This is confusing… Plz help me understand this?

    # July 4, 2012 at 3:05 pm

    It reads like this:
    background-position: X-position Y-position;
    There are two separate axes (the x-axis and the y-axis) that need to be told what to do.

    As for the other bit, the text-indent is only moving the text off of the screen, but not the link itself.

    # July 4, 2012 at 3:31 pm

    background-position:center center ensures that the background image will be both horizontally and vertically centered in its container. I believe most browsers consider one center to be equivalent, so using two is likely either a matter of personal preference, or just to be safe with all browsers.

    # July 7, 2012 at 6:06 am

    Wonldn’t moving text off of the screen coz the links to disappear? Why? Link are text ryt..? Then why not?

    # July 7, 2012 at 6:07 am

    thx for your answers… now i understand what postion means…

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".