General (and noobish) question

  • Resolved gluecklichezwerge

    (@gluecklichezwerge)


    6 years, 8 months ago

    Hi all,

    I am a little bit ashamed to ask this, but after trying and trying without desired results I finally end up here.
    In the footer area of my page I added two social media buttons, which are simply implemented in a html widget. Now I would prefer to only have the icon as an active part. All my attempts to limit width through CSS ended with all of my html widgets having that width.
    In the widget I use this code to display the icons:

    <a href="https://www.facebook.com/gluecklichezwerge" title="...auf Facebook" rel="me" target="_blank">
<img alt="Facebook" src="/wp-content/uploads/2018/03/Facebook.png" width="26" height="26" />
</a>

    Is there another way I should use to add the buttons?
    Or did I addressed them the wrong way? In CSS I tried #custom_html-10 and div.textwidget.custom-html-widget.

    Thanks for your help,

    -Bj?rn

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

Viewing 4 replies - 1 through 4 (of 4 total)
  • Caleb Burks

    (@icaleb)

    Automattic Happiness Engineer

    I think this is what you need if I’m understanding correctly:

    
#custom_html-10 div.textwidget.custom-html-widget a {
    display: inline-block;
}

    Otherwise I’m not not sure I follow what you mean by “active part”. Could you explain a bit more what you are trying to do?

    Thread Starter gluecklichezwerge

    (@gluecklichezwerge)

    Hey Caleb,

    thanks for your reply.
    With ‘active’ I mean only the icon should be clickable. Currently you can click the link even outside of the icon.
    Editing rollOver behaviour might be more difficult that’s why I tried with resizing the html widget. But maybe I’m thinking of it the wrong way. Is there another way to add the buttons?

    Thanks again,

    -Bj?rn

    Joel Williams

    (@joelwills)

    Automattic Happiness Engineer

    Hi Bj?rn!

    I see what you mean. However I’ve tested Caleb’s CSS on your site and that fixes the problem.

    Add that to your Customizer under Appearance > Customize, in the Additional CSS section.

    You could align the buttons next to each other, rather than below, which would solve the problem in a different way, but the CSS works.

    All the best!

    Thread Starter gluecklichezwerge

    (@gluecklichezwerge)

    Hi Joel,

    hm, I thought I already tried his code. ??
    Now that you brought this up I gave it another try and you are right, issue solved.

    Thanks for your help, guys! Have a refreshing weekend!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘General (and noobish) question’ is closed to new replies.