Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #806541

    Hi Support Theme

    Because of video problems on mobile we decide to have diferent content for mobile and desktop. We solved with 2 color section, but we still have 2 small problems:

    1. the hight or pading or …
    – it shout show like here : https://reneechabot.com/fix-foto-london/ and not like here: https://reneechabot.com/fix-foto-london-2/

    2. botton border on: https://reneechabot.com/fix-foto-london-2/. how can i change to no borader

    All the best, Pascal

    #806579

    Hey Pascal,
    Try this code in the General Styling > Quick CSS field:

    @media only screen and (max-width: 767px) { 
    .html_entry_id_4521 #after_section_2.main_color {border-color: transparent !important; }
    .html_entry_id_4521 .template-page.content {padding-top: 0px!important; }}

    This is designed to work only on that page, in mobile, hope it helps :)

    Best regards,
    Mike

    #806590

    Hi Mike
    Thank you for your answer, but it also should work on desktop. And it should also minimize the space between title and video / photo.

    All the best, Pascal

    PS: the color section has also an id desktop-only/mobile-only, will it work general for this id?

    #806596

    Hi,
    Try this code in the General Styling > Quick CSS field:

    .html_entry_id_4521 #after_section_2.main_color {border-color: transparent !important; }
    .html_entry_id_4521 .template-page.content {padding-top: 0px!important; }
    .html_entry_id_4521 .entry-content-wrapper {margin-top: 0px !important; }

    Best regards,
    Mike

    #815767

    Hi Mike

    I have made 2 color section: 1 for desktop only and 1 for mobile only, because video does not work on mobile in the slider.

    So if you looking to the 2 blog entry:

    and

    there is still a big whitg gab between titel and slider and between slider and text. we would that it look like on this blog post:
    https://reneechabot.com/ (Purchase code hidden if logged out) /

    All the best,
    Pascal

    #817618

    Hi,

    The space is created by the following css modifications.

    .fullsize .content .entry-content-wrapper {
        padding-right: 0;
        margin-top: 95px;
    }

    What is that for?

    Best regards,
    Ismael

    #817664

    Hi Ismael

    Thank you, this is just for the layout (that it is on the same line as the menü in desktop view) and works perfekt. This space is not the probleme.

    pls check different with the color section and without. the problemes only apear only with color section:

    with color sections (not ok) and (Purchase code hidden if logged out) /”>without color section

    All the best,
    Pascal

    • This reply was modified 3 months, 2 weeks ago by  someco.
    #818521

    Hi,

    That css modification creates the space. Please remove it temporarily so that you can see the difference.

    Best regards,
    Ismael

    #818613

    Hi Ismael
    Ok, you are right, but how can change it that that space 95px is on 1. desktop version and 2. just on the top?

    All the best,
    Pascal

    #819210

    Hi,

    1-2.) Replace the code with the following.

    @media only screen and (min-width: 990px) {
      /* Add your Desktop Styles here */
      #main {
        margin-top: 95px;
      }
    }

    Best regards,
    Ismael

    #820072

    Hi Ismael

    I did it the following way:

    @media only screen and (max-width: 769px) {
    #only-desktop #main {
    display: none !important;
    border-color: transparent !important;
    margin-top: 95px;
    border-color: transparent !important;
    }}

    But it does not work, maybe i dit it wrong with {

    All the best ,Pascal

    #820457

    Hi,

    Please remove the “#only-desktop” selector. Or just use our previous suggestion.

    Best regards,
    Ismael

    #820473

    Hi Ismael

    But if i made it like you it dows not work.

    All the best, Pascal

    #822284

    Hi,

    Please remove the whole css declaration because it is invalid. Replace it with the following.

    @media only screen and (min-width: 768px) {
       #main {
          border-color: transparent !important;
          margin-top: 95px;
       }
    }
    

    Best regards,
    Ismael

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

You must be logged in to reply to this topic.