Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #734759

    Hi chaps,

    I’ve searched existing threads to try and resolve this but still no luck.

    If you view http://james.artyzans.co.uk/wp/accommodation/ on desktop, I’ve added some padding to the left right of every element down the page to go for a slightly more boxed style for this page in particular. When viewing the same page in mobile view, the columns stack which is totally fine, but the padding associated with each column offsets the elements into very narrow long text paragraphs. Is there a ‘global’ and individual method to make elements ignore the padding up until the theme’s responsive functionality kicks in to display the columns in rows again?

    All the best,

    James

    #735734

    Hey Jambo,

    Try adding this css code in Quick CSS (located in Enfold > General Styling):

    @media only screen and (max-width:767px) {
      .responsive #top #wrap_all .flex_column {
        padding: 0 !important;
      }
    }

    Hope this helps :)

    Best regards,
    Nikko

    #735824

    Hey Nikko,

    Absolutely awesome, exactly what I was after!

    You even fixed my testimonials which were pencil thin without all this code!

    
     /* resizing testimonial (tablet)
    -------------------------------- */
    @media only screen and (max-width: 768px) {
    #top .avia-slider-testimonials.avia-testimonial-wrapper .avia-testimonial-row {
         width: 125%;
         left: -75px;
    }}
     /* resizing testimonial (iPhone 5 portrait)
    -------------------------------- */
    @media only screen and (max-width: 500px) {
    #top .avia-slider-testimonials.avia-testimonial-wrapper .avia-testimonial-row {
         width: 130%;
         left: -42px;
    }} 

    Great stuff dude!

    Thanks,

    James

    #736226

    Hi James,

    Thanks for your kind words and using Enfold. Glad we could help :)

    Cheers!
    Nikko

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