Skip to main content

Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #254045
    culbrique
    Participant

    Hi !
    I can’t get my loading dot animation working in the very center of my div.
    I tried everything, transform-origin, flexbox and many other things…
    This is a reduced test case, and the challenge is keep the :before value because the div has already something inside.

    https://jsfiddle.net/L37gb4cg/

    Do you have some advices ?
    For extra-suppa-pro animation, the dot needs to be at 30px max. when it get big and 5px to min….

    #254053
    Shikkediel
    Participant

    Probably easiest to used a centered dot:

    https://jsfiddle.net/pr54v6bb/

    #254058
    culbrique
    Participant

    Yes, good point, but this dot is aligned to the bottom of the bottom, it’s not animated from the center of the dot

    #254065
    Shikkediel
    Participant

    Not sure what that means or refers to…
    You don’t have to use a content dot of course, you could make the element a square with rounded corners using border-radius: 50%. That’ll give a lot more control over it.

    #254069
    bearhead
    Participant

    something like this maybe?
    https://jsfiddle.net/8huv76tp/

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.