Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #995109

    Hi
    Having a big issue with the front page not resizing properly in tablet view.
    Here’s what’s in quick css:
    .iconbox_top .iconbox_content {
    box-shadow: 2px;
    border: 2px solid #069de3;
    }
    #header .widget {
    left: 100%;
    padding-top: 0;
    position: absolute;
    top: 0;
    transform: translate(-50%);
    z-index: 999;
    }
    #sub_menu1, #sub_menu1 a {
    background:#109bc5;
    font-size: 18px;
    color: white;
    }
    .toggle_icon {
    position: absolute;
    width: 15px;
    height: 15px;
    border-style: solid;
    border-width: 1px;
    top: 24px;
    left: 10px;
    }
    .toggler {
    font-size: 23px;
    line-height: 2em;
    }
    #menu-item-search {
    display: none;
    }
    .main_menu{ right: -20px;}
    #top .av-submenu-container, .av-submenu-container a {
    background-color: #069de3 ;
    }

    #top .av-subnav-menu li a {
    background-color: transparent;
    color: white;
    }
    #top .av-section-tab-title {
    padding-right:60px!important;
    }
    .av-inner-tab-title {
    font-size: 20px;
    color: white !important;
    }
    .av-section-tab-title.av-active-tab-title {
    color: white !important;
    }
    .main_color .av-boxed-grid-style .avia-testimonial {
    background: transparent;
    }
    .avia-menu a {
    font-size: 15px !important;
    }
    .avia-slideshow-button {
    padding: 30px 30px !important;
    font-size: 30px;
    }

    .white-popup {
    position: relative;
    background: #FFF;
    padding: 20px;
    width: auto;
    max-width: 500px;
    margin: 20px auto;
    }
    .container_wrap { border-top: none !important; }
    #top .av-submenu-container li a {
    font-size: 15px;
    font-weight: 600;
    }
    h1,h2,h3,h4,h5,h6 {
    text-transform: none !important;
    }
    h3.aviaccordion-title {
    color:black !important;
    }
    @media only screen and (max-width: 767px) {
    .responsive #scroll-top-link {
    display: block !important;
    }
    }
    @media only screen and (max-width: 767px) {
    .home .av-slideshow-caption .avia-caption-title {
    font-size: 16px !important;
    }

    .home .avia-caption-content p {
    font-size: 12px !important;
    }
    }
    #top #wrap_all div.av-player.av-player-Container{
    border-color: transparent;
    }
    @media only screen and (max-width:767px) {
    .responsive #top.page-id-4283 #full_slider_1 .avia-slideshow.av_slideshow_full,
    .responsive #top.page-id-4283 #full_slider_1 .avia-slideshow.av_slideshow_full .avia-slideshow-inner,
    .responsive #top.page-id-4283 #full_slider_1 .avia-slideshow.av_slideshow_full .avia-slideshow-inner li {
    overflow: visible !important;
    }

    .responsive #top.page-id-4283 .slideshow_caption .slideshow_align_caption {
    text-align: left;
    }

    .responsive #top.page-id-4283 #full_slider_1 .caption_fullwidth,
    .responsive #top.page-id-4283 #full_slider_1 .caption_fullwidth .slideshow_caption {
    position: static !important;
    }

    .responsive #top.page-id-4283 #full_slider_1 img {
    width: 100% !important;
    }
    }
    .map_pl_container {
    border: none;
    }

    #995243

    Hey carla,

    Where can we see the actual problem? For future threads; there’s really no point in posting all the CSS you have added, it only makes the thread hard to read.

    Best regards,
    Rikard

    #995390

    You can check the images I sent and apologies for the code and not sending link…Also doing odd things to the testimonial page when in mobile view

    #995512

    Hi fashiontribe,

    Here is the code you can put in Enfold > General Styling > Quick Css,  if it does not work, put into themes/enfold/css/custom.css

    
    @media only screen and (min-width: 768px) and (max-width: 1024px) {
        #deletions .container {
            width: 90vw;
            padding: 0 20px;
            max-width: 90vw;
        }
        .av_icon_caption.av-special-font font {
            word-break: break-all;
            font-size: 18px;
        }
    }
    

    If you need further assistance please let us know.

    Best regards,
    Victoria

    #995548

    That did not work in either place.

    #995931

    Hi fashiontribe,

    Could you please attach some screenshots of the issue?

    Best regards,
    Victoria

    #995932

    I did in the beginning, but here you go.

    #996020

    Hi fashiontribe,

    You have an error in your Quick css, you need to validate it. SO the code I gave you did not work for that reason probably.

    I put the code I gave you and the code below:

    
    @media only screen and (max-width: 1024px) and (min-width: 768px) {
      .responsive.html_mobile_menu_tablet #top #wrap_all #header {
        position: fixed;
      }
    
      #intro .container {
        max-width: 100%;
      }
      #top .no_margin.av_one_fourth {
        padding: 20px !important;
      }
       #intro .no_margin.av_one_fourth h3 {
         word-break: break-word;
         font-size: 18px
       }
    }
    

    Please check the page.
    Best regards,
    Victoria

    #996039

    That worked! Thanks, the first row of boxes is still off on resizing as is the items we get deleted sections. Please see pics.
    Thanks, again

    #996454

    Hi fashiontribe,

    Could you please clear the cache, check again and get back to us.

    Best regards,
    Victoria

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

You must be logged in to reply to this topic.