Support » Theme: Twenty Twenty-One » Banner css center en responsive

Banner css center en responsive

  • Resolved ariextreme

    (@ariextreme)


    2 weeks, 3 days ago

    Hi,

    I hope someone is able to give a bit css support.

    I have add an advertisement on top op the single pages and tried to get it right: in the middle and responsive folling the css guidelines. However, I just do not get it right.

    Many thanks in advance for who is albe to have a look.

    Best,

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

Viewing 4 replies - 1 through 4 (of 4 total)
  • Oliver Campion

    (@domainsupport)

    2 weeks, 3 days ago

    When asking for help with your CSS, it’s best to remove any javascript that prevents right click to make the job of helping you easier 😉 That being said, inspecting the HTML is not prevented by disabling right-click. it’s just a pain 🙂

    It looks like you are using a child theme (or you’ve edited the original theme?!).

    To let the parent theme deal with the responsiveness, you should change the container’s classes to <div class="alignwide banner-center">

    Then try adding this CSS to center the banner …

    .banner-center p {
text-align: center;
}
.banner-center img {
display: inline;
}

    … or …

    .banner-center img {
margin: 0 auto;
}

    Both should do what you require.

    Oliver

    ariextreme

    (@ariextreme)

    2 weeks, 3 days ago

    Hi Oliver,

    I am sorry for the right-click. Had put it down as soon I asked help but perhaps you was too fast for me. 😉

    Will test your advice now.

    Best,

    ariextreme

    (@ariextreme)

    2 weeks, 3 days ago

    Hi Oliver,

    It works. Only css I add to the img was max-width: 100%; This helped to make the image responsive on mobile.

    Many thx again. If you ever are in NL and would like to kitesurf, please let me know.

    • This reply was modified 2 weeks, 3 days ago by ariextreme.
    Oliver Campion

    (@domainsupport)

    2 weeks, 3 days ago

    Awesome, yes, you’d already got the max-width in your CSS. Glad you’ve sorted it.

    So you don’t have to modify the parent theme or have a child theme have you considered using get_template_part_template-parts/content/content hook to inject the banner above the content?

    Ah! Kitesurfing is great, but too cold for me haha! We have Camber Sands 3 miles away 🙂

Viewing 4 replies - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.

Topic Tags

Views