Equal size sprite items
  • Hi Polat

    One frequent use I have for sprites is to collate a bunch of buttons sent over by designers. As somebody already mentioned in the discussions, Photoshop is very bad at keeping all of these sliced outputs at the exact same size.

    What would be really useful to me is if there was an option to make all sprite "slots" the same size (options for "same width", "same height", "same height & width") with that slot size generated automatically by the largest included graphic (again could be an option - "size to largest", "size to smallest", "custom size - [*] px by [*] px").

    You'd then need to have options for alignment of each graphic within the slot - Vertical: "middle", "top", "bottom" Horizontal: "center", "left", "right".

    This would mean that each slot would end up being exactly the same size, which is much easier to check and to modify, if required, in the resultant CSS.

    Without it, you end up with a nightmare of different dimensions to try and get your head around - exactly what this app frees us from!

    I've got a screen-grab for you if you want (why can't we post files here?) but here's some sample output, illustrating the issue. Note all the different dimensions:

    .mb_accidents_at_work:hover
    {
    background-position:0px 0px;
    width:179px;
    height:34px;
    }
    .mb_accidents_at_work
    {
    background-position:-179px 0px;
    width:172px;
    height:28px;
    }
    .mb_benefits_of_using_solicitor:hover
    {
    background-position:0px -34px;
    width:178px;
    height:34px;
    }
    .mb_benefits_of_using_solicitor
    {
    background-position:-178px -34px;
    width:172px;
    height:28px;
    }
    .mb_buyers info:hover
    {
    background-position:0px -68px;
    width:178px;
    height:34px;
    }
    .mb_buyers info
    {
    background-position:-178px -68px;
    width:172px;
    height:28px;
    }
    .mb_cic:hover
    {
    background-position:0px -102px;
    width:179px;
    height:34px;
    }
    .mb_cic
    {
    background-position:-179px -102px;
    width:172px;
    height:28px;
    }

    Best regards

    Mike Laye

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!