Announcement

Collapse
No announcement yet.

Centering in a circle

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Centering in a circle

    This one has me stumped. I need to center the cart quantity in the fasten_header which I have modified to look like a "circle". It looks like this

    14MEHd.png

    The CSS I have is

    Code:
    .t-site-header__basket-link-quantity {
        padding: 0.25em 1.125em 0.25em 0;
        border-radius: 1em;
    }
    If I play with the padding I lose the circle shape. Should I try percentages?



    Leslie Kirk
    Miva Certified Developer
    Miva Merchant Specialist since 1997
    Previously of Webs Your Way
    (aka Leslie Nord leslienord)

    Email me: [email protected]
    www.lesliekirk.com

    Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

  • Hi Leslie,

    Based off the stock code, using a percent should do what you want.
    Code:
    .t-site-header__basket-link-quantity {
        margin-left: 0.25em;
        padding: 0.5rem 1em;
        border-radius: 50%;
    }
    Matt Zimmermann
    Director of UI/UX Standards and Theme Development
    / Miva, Inc.

    Comment


    • Thanks Matt, that's getting in the right direction!
      Leslie Kirk
      Miva Certified Developer
      Miva Merchant Specialist since 1997
      Previously of Webs Your Way
      (aka Leslie Nord leslienord)

      Email me: [email protected]
      www.lesliekirk.com

      Follow me: Twitter | Facebook | FourSquare | Pinterest | Flickr

      Comment

      Working...
      X

      This website uses cookies to identify visitors, track visitors to our website, store login session information and to remember your user preferences. By continuing to use this site you agree to our use of cookies. Learn More.

      This website uses cookies. By continuing to use this site you agree to our use of cookies. Learn More.

      Accept