Viewing 13 posts - 1 through 13 (of 13 total)
  • Author
    Posts
  • #1495516

    Hello, can you look at my CSS and see if it looks ok? I am trying to move down the text areas and button in the Hero section.

    How do I just move that area down, so it is centered better between logo and bottom?

    Also, with centered logo, is there way to add Social Media icons or not?

    #1495517

    Also, how can I get the rounded button corners, and possible images to have rounded corners?

    #1495518

    Sorry, I think I fixed the positioning. Can you just see how it looks on mobile view? Can we make the logo larger and maybe add social media icons? not sure if that will be too busy. Maybe just bigger logo and bigger menu burger?

    THanks!!

    #1495577

    Please let me know on these when you can. thanks!

    #1495582

    Hi,
    This is how it looks on my mobile:
    qfQfIEu.png
    The logo & burger menu both look large to me, do you still want them larger?
    If you want to show the social icons on mobile, I recommend showing them in the top bar, but this will also show on desktop, probably not what you want.
    How about adding the social icons to mobile menu?

    Best regards,
    Mike

    #1495585

    mine shows different and off center. How do I adjust sizes and position?

    https://drive.google.com/file/d/18drlqw6M6q3U4a34w5TRLTLjYtNkA81P/view?usp=sharing

    Also, how can I get the rounded button corners, and possible images to have rounded corners?

    #1495586

    next

    • This reply was modified 5 days, 10 hours ago by bemodesign.
    #1495587

    I got the rounded corners, just let me know where i can adjust size and position for both logo and burger.

    And the Burger Icon is not centered to the logo when it shrinks on mobile view.

    thanks!

    #1495601

    Hi,
    There is not a setting, you will need to use css. Since I’m not seeing the same as you I had to guess a little, try the following css and adjust to suit:

    @media only screen and (max-width: 767px) {
        #top .logo img {
        max-height: 140px;
        }
        #top .logo img {
        left: 55%;
        transform: translateX(-50%);
        }
        #top .av-burger-menu-main {
        transform: translateY(-38%) !important;
        }
        .av-hamburger-box {
        width: 50px!important;	
        }
        .av-hamburger-inner::before{
        top: -15px;
        }
        .av-hamburger-inner::after {
        bottom: -15px;
    		}
    		.av-hamburger-inner, .av-hamburger-inner::before, .av-hamburger-inner::after {
        height: 6px;
    		}
    }

    This is how it looks for me with this css:
    qq3u5Ml.png

    Best regards,
    Mike

    #1495624

    this is great!

    1. can I have the header “shrink” a little when scrolling on mobile?

    2. Now that logo is bigger, it is too close to Headline and text area with button. How can I move all this down a little? or do I add a space above the header?

    thanks!

    #1495637

    Hi,
    To shrink the header and logo on mobile scroll I added this css to the end of your Quick CSS field:

    /* mobile shrinking header */
    @media only screen and (max-width: 767px) {
    #top #header:not(.av_header_transparency) #header_main > .container {
    	 height: 70px !important;
       line-height: 70px !important;
    }
    .responsive #top #header:not(.av_header_transparency) .logo img {
       height: 60px !important;
    }
    .responsive #top #wrap_all #header:not(.av_header_transparency) .main_menu {
        top: -12px;
    }
    }

    adjust to suit.
    As for moving the logo up away from the text try this css and adjust to suit:

    .responsive #top #header .logo img {
    top: -10px;
    }

    but you don’t have much room in the header, so you may need to adjust the previous css that changed the size of the logo to suit, I can not because I don’t see the same as you do, to me it looks like plenty of room:
    qqcZE5N.png

    Best regards,
    Mike

    #1495651

    you are awesome!!

    #1495669

    Hi,
    Thanks, glad that we could help, if you have further questions please open a new thread and we will try to help. Thanks for using Enfold.

    Best regards,
    Mike

Viewing 13 posts - 1 through 13 (of 13 total)
  • The topic ‘Mobile view – Hero text position’ is closed to new replies.