How to space out icons in mobile version

  • Resolved cmidmore

    (@cmidmore)


    6 years ago

    All great except this one thing: In the mobile version, the 3 icons are in a cluster in the middle of the bar, phone and email on one row, facebook icon below them. They’re so close together that someone could easily press the wrong one by mistake. Can I spread them out evenly across the page in a single row?
    Many thanks in advance

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Martin Stehle

    (@hinjiriyo)

    Go to the Customizer, panel “Additional CSS” and paste this code there:

    @media screen and (max-width:480px) {
	#scb-wrapper #scb-socialicons {
		margin-top: 16px;
	}
}

    If you want to change the gap change the number (and only the number) at 16px until you got the desired result..

    Thread Starter cmidmore

    (@cmidmore)

    Hi,
    Thank you very much for that, I’ve tried it and it splits the two rows further apart, which is good, but what I was really hoping also is to be able to have all the icons on one row. Don’t worry if it’s a pain to do, would just look nicer on the mobile version as it would take up less vertical space,
    Many thanks again!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to space out icons in mobile version’ is closed to new replies.