Forum Replies Created

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • in reply to: SEARCH ICON NOT SHOWING ON MOBILE #42701
    Anne Howard
    Participant

    Thanks!

    in reply to: The Header for Single Post are not responsive #42691
    Anne Howard
    Participant

    FIXED!

    in reply to: The Header for Single Post are not responsive #42689
    Anne Howard
    Participant

    Chat gpt has created this code, to address issue with my logo, h2 and h3. Do you approve?
    /********************************************
    * SITEWIDE LOGO SIZE
    ********************************************/
    .site-logo img,
    .custom-logo {
    max-height: 160px !important; /* desktop size */
    width: auto !important; /* maintain aspect ratio */
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    }

    /* Reduce excess header spacing */
    .site-branding,
    .header-main,
    .site-header {
    padding-top: 5px !important;
    padding-bottom: 5px !important;
    min-height: unset !important;
    }

    /* Center the logo */
    .site-branding {
    position: relative;
    text-align: center !important;
    }

    .site-logo,
    .custom-logo {
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    }

    /********************************************
    * TABLET (under 1024px)
    ********************************************/
    @media (max-width: 1024px) {

    .site-logo img,
    .custom-logo {
    max-height: 130px !important;
    position: relative !important;
    left: auto !important;
    transform: none !important;
    }

    .site-branding {
    text-align: center !important;
    }

    /* H2 tablet size */
    .entry-content h2 {
    font-size: 1.75rem;
    line-height: 1.3;
    }
    }

    /********************************************
    * MOBILE (under 768px)
    ********************************************/
    @media (max-width: 768px) {

    .site-logo img,
    .custom-logo {
    max-height: 90px !important;
    }

    .site-branding,
    .header-main,
    .site-header {
    padding-top: 3px !important;
    padding-bottom: 3px !important;
    }

    /* H2 mobile optimization */
    .entry-content h2 {
    font-size: 1.5rem;
    line-height: 1.25;
    margin-bottom: 0.75em;
    }
    }

    /********************************************
    * SMALL MOBILE (under 480px)
    ********************************************/
    @media (max-width: 480px) {

    .site-logo img,
    .custom-logo {
    max-height: 75px !important;
    }

    /* Extra-small mobile H2 */
    .entry-content h2 {
    font-size: 1.35rem;
    line-height: 1.2;
    }
    }

    /********************************************
    * CONTENT IMAGE STYLES
    ********************************************/
    .entry-content img,
    .entry-content figure img,
    .wp-caption img {
    max-width: 100%;
    height: auto;
    }

    /********************************************
    * STYLES FOR POST HEADINGS (h3)
    ********************************************/
    .single-news-area .grid-view-news-area.vrsn-five .post-content h3 {
    word-break: normal;
    font-size: 1.5rem;
    }

    in reply to: The Header for Single Post are not responsive #42688
    Anne Howard
    Participant

    The second link opened and yes, that would be an appropriate break in the flow. Right now, I have a case, where the header is broken by one letter. Let me show you.
    I can’t upload images to show you!

    in reply to: The Header for Single Post are not responsive #42656
    Anne Howard
    Participant

    The link doesn’t open.

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