• Closed
  • Tristan Seifer
    Spectator
    October 20, 2015 at 11:44 pm #21538

    On the computer screen the titles all read perfectly but on the smaller iphone screen the longer titles get stuck on top of each other. What can I do?

    Also, how can I add a button without everything running together on small screens?

    Thank you.

    Denzel Chia
    Moderator
    Posts: 2656
    October 21, 2015 at 9:57 am #21546

    Hi,

    Please provide your website url.
    I will try to provide CSS code to fix your issue.

    Thanks!

    Tristan Seifer
    Spectator
    Posts: 4
    October 21, 2015 at 7:20 pm #21564

    http://208.106.235.84/

    thank you.

    Denzel Chia
    Moderator
    Posts: 2656
    October 22, 2015 at 9:58 am #21581

    Hi,

    Please use the following codes in your Theme Options -> Custom CSS

    @media screen and (max-width: 768px) {
    .header {
    height: 250px !important;
    }
    .container.container-header.custom-header {
    height: 250px !important;
    }
    }

    Thanks!
    Denzel

    Tristan Seifer
    Spectator
    Posts: 4
    October 23, 2015 at 1:51 am #21587

    Thanks, Denzel. I followed your directions, but the font is still smushed on the iphone when held in portrait. (it was always ok in landscape.) Is there someway to make the words go onto two lines?

    thanks.

    Denzel Chia
    Moderator
    Posts: 2656
    October 23, 2015 at 8:23 am #21593

    Hi,

    Please kindly provide me with a screenshot and some annotation of the problem area.
    It’s will be good if you can point to me the area that your fonts are smush.

    This will help me understand better.

    Thank you.

    Regards,
    Denzel

    Tristan Seifer
    Spectator
    Posts: 4
    October 23, 2015 at 9:48 am #21598

    Thanks, Denzel. I am not sure how to upload images into this reply box.

    The words are getting smushed together on the titles the move across the photos on my homepage. One slide is fine, but the other two are unreadable when the phone is held in portrait.

    Appreciate your help,
    Tristan

    Denzel Chia
    Moderator
    Posts: 2656
    October 24, 2015 at 7:03 am #21608

    Hi,

    Some script or plugin on your site is breaking the responsiveness of your website on desktop view. You need to remove it.

    When I resize my desktop browser, your website does not resize accordingly.
    I am unable to troubleshoot your slider in mobile view unless I am able to get the website to resize on desktop view. I need to use desktop developer tools for troubleshooting your mobile issue.

    I am able to see your slider text getting smushed together on my iPhone 6 Plus.
    The problem is I am unable to provide solution based on what I see on my mobile phone.
    I need the desktop view to resize properly.

    Hope you understand my explanation.

    Thanks!
    Denzel

    Lisa Kurtz
    Spectator
    Posts: 10
    November 28, 2015 at 5:24 pm #22524

    Hi Denzel. I might be having a similar issue. Web site is waldenfloral.com. The issue is the Bootstrap Slider on the very first Welcome page slide, where is says “Beautifully fresh floral designs created especially for you.” This title appears correctly on the desktop version. However, when viewed in portrait orientation on a mobile phone, the title appears in two lines that are smashed on top of each other. It is as if there is not enough space between the two lines. It looks fine in landscape orientation but because this is the first thing viewers might see, I need to fix the portrait orientation. Will the code that you outlined above in your reply to Tristan Seifer fix my issue as well?

    Denzel Chia
    Moderator
    Posts: 2656
    November 29, 2015 at 8:37 am #22537

    Hi,

    Please try the following codes in your Theme Options -> Custom CSS

    @media screen and (max-width: 768px){
    .carousel-caption h2 {
    line-height: 1.2em !important;
    position: relative;
    top: 25px !important;
    }
    }

    Thanks!