Before you ask please READ THIS

Hiding a row on mobile

Hi,

I'm trying to hide a row on mobile view but can only find the option to hide columns. Is it possible to hide a full row? It is a header row with an image set to full width in the background, but this image is not resizing on mobile so I'm getting a really weird crop. https://www.themixingclass.com/who

My solution was to hide the row and add another image which is only visible on mobile, but open to other ideas if you have any.

Any help greatly appreciated, as always. Love your theme!

Comments

  • AirAir
    Posts: 10,970
    Hello hannah:)

    I am not sure about row, however I will ask Daniel to take a look later at your issue, as we have day off today;-)

    Anyway about background image - cause of nature of background images, it is highly advised to set there images that are important for content. It means images that can be cropped anyway, and still will have same meaning.

    If you are interested in showing person that is put there, better option is to insert it as normal image. This way you can be sure it will be in place always.

    Other solution is to add some special CSS that will position this background image on various resolution. However Visual Composer lack from such settings, so only way is using hand written CSS.

    With kind regards.
  • Posts: 422
    Hello Hannah

    First of all, WOW i really like your site. Good Job!
    I can only recommend one thing, try to use font with anti-aliasing in your logo.
    It will boost good first impression :)

    About your question. Yes you're right there is no chance to hide a ROW but i found solution for you! :) Instead of hiding a ROW hide a Column ;)

    Let's try my way:
    1) Create a new ROW and stretch it to full width (without paddings) - http://nimb.ws/OS9hlM
    2) Add your custom heading to this ROW like you did it before.
    3) Now go to the Column settings and add paddings and background in similar way like you did it in the ROW settings - http://nimb.ws/itAz0J
    4) Next to the Responsive Settings in the same Column (next Tab) and choose where this Column should be hidden - http://nimb.ws/rX7AOc
    5) You can now create a new column in the same ROW - http://nimb.ws/eLAla0 and add similar settings but with different Responsive options (to be visible only on mobile)

    I hope it helps :)

    With Regards
    Daniel
    Lead Graphic Designer
  • Posts: 6
    Hi both.

    This sounds like a great solution, thanks so much for your help.

    Also thanks for the tip on the logo.

    Have a great weekend,
    Hannah
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!