Home Forums Theme support Responsive layout CSS

Tagged: , ,

This topic contains 3 replies, has 2 voices, and was last updated by  7Theme Support 1 year, 10 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • Hello,

    I’ve a question of modifying the layout when I open the site on a mobile:

    1) problem: text over image:
    < removed >

    2) problem: too much white space between elements:
    < removed >

    I know there is a CSS: responsive, but don’t want to “mess it”…

    Thanks for helping!
    Bregt

    Hi Bregt,

    I think it’s because you have added a lot of content in the extra header content section, because on our demo website it works.

    To change it, you can use these codes:

    @media only screen and (max-width: 767px) {
    #container .headline_additional_content, #container .header_add_content {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    }
    #container #brand img, #container #brand a {
    margin-top:0;
    }
    }

    This should reduce the white space and prevent the content from covering the logo

    Thanks for the reply!

    It works when I added:

    @media only screen and (max-width: 767px) {
    #container .headline_additional_content, #container .header_add_content {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    }
    #container #brand img, #container #brand a {
    margin-top:0px;
    }
    }

    AND

    @media only screen and (max-width: 479px) {
    #container .headline_additional_content, #container .header_add_content {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    }
    #container #brand img, #container #brand a {
    margin:0px auto !important;
    }
    }

    ps: How can I delete this whole topic? (screenshots)

    Ok, great, I’m glad it’s working now. We removed the screenshot from your posts…

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.