Divi WordPress Theme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

WordPress fix Reply To: Header doesn’t shrink on mobile

Discussion in 'Misc WordPress Requests' started by employmentlaw, Jan 16, 2018.

  1. employmentlaw


    Reply To: Header doesn’t shrink on mobile, by employmentlaw

    try —

    @media only screen and (max-width: 600px)

    .site-header .menu-toggle {
    background: #632E9B;
    color: #fff;
    font-size: 30px;
    font-size: 3rem;
    font-weight: 300;
    padding: 10px 5px 0px 0px;
    margin: 0;

    .site-title {
    font-size: 16px;
    padding-top: 13px;
    line-height: 16px;

    .header-search-icon:before {
    content: '\f400';
    color: #632E9B;
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font: normal 35px/1 'Genericons';
    vertical-align: top;

    .header-search-icon {
    padding: 14px 8px 8px 5px;

    The idea being to effect those elements when it is small (mobile phone.)
    The problem is if all those header items don’t fit or have too much padding then they will carry down into increased height for the header. So the idea being to fit everything on one strip across.
    Too many odd css rules, especially sizes, trying to get it to work. You just need certain elements overruled at the correct size.

    Reply To: Header doesn’t shrink on mobile

Share This Page

Monarch Social Sharing Plugin