- This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I’m the webs designer for a WordPress site that uses the Espresso theme located and active here:
http://www.sofiawellman.com/
If I add an additional social icon (making it 8 icons) using the theme’s option function. It shows all on one line on desktop and larger phones like the iPhone 6 and screens larger. It will bring the additional icon down on a new line on smaller screens like the iPhone 5 and smaller.
I’m trying to figure out where in the CSS code or add a line of custom CSS and what to change to allow the mobile setting to show all 8 icons on one line in the header of the site. I think if I slightly decrease the amount of space between the icons and decrease the padding or margins on the sides it will put all 8 icons on one line.
To solve this, do you need the theme php file content? Is a browser’s Web Inspector enough? I’m happy to provide any code necessary to get this resolved. Here is a link to the custom CSS added to the themes site. Some of this code was done by the previous web designer.
Link to CodePen CSS:
http://codepen.io/jmontgom/pen/ozkXPk
Thanks in advance for the help.
Jay
You could try reducing the left margin for the social links on smaller screen widths
It’s this selector in your css:
section.social-search a.social