Forums

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

Home › Forums › CSS › How to create 2 lines on both sides of a background image?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • June 11, 2017 at 5:41 am #255786
    serhiicss
    Participant

    design

    The mustache is a background-image and the 2 lines are preferably to be pseudo elements ::before and ::after.

    This is what I have came up with so far:
    Codepen

    Thank you in advance!

    June 11, 2017 at 7:06 am #255787
    Beverleyh
    Participant

    Is the problem that you can’t space the lines at equal distance from each side of the moustache?

    Try using positioning; relative on the parent, absolute on the child/pseudo elements. Note that the negative offset of the :before element is a total of the width + margin-left of the :after element https://codepen.io/anon/pen/yXOXGq

    June 14, 2017 at 10:35 am #255858
    serhiicss
    Participant

    Sorry for late response. Thank you for your help! It worked well.

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