Services section – alignment problem

  • waveman777

    (@waveman777)


    9 years, 4 months ago

    Hello,

    I noticed that services don’t align properly on smaller screens. I use 3 columns for Services Layout Setting and I replaced default icons with my own images.

    This is how it looks on full screen:
    image1

    But when I scale it down, there is a gap between second and third section
    image2

    Then, when I scale it down slightly more, it gets much worse:
    image3
    and I think this small range of width is not covered properly by “@media screen…” parameters in style.css file, making the text are so narrow that it’s not even readable

    And finally, a bit better but still with a gap between second and third image:
    image4

    What’s interesting is that there is no problem with the alignment when “2 columns” or “1 column” style is used. What I mean by that is that there is no gap between second and third image.

    I’d appreciate some help with this. Thank you.

    • This topic was modified 9 years, 4 months ago by waveman777.
Viewing 11 replies - 1 through 11 (of 11 total)
  • congthien

    (@congthien)

    9 years, 4 months ago

    Hi @waveman777,

    What is your site url?

    Thread Starter waveman777

    (@waveman777)

    9 years, 4 months ago

    Hi @congthien

    My site is still under development so it’s on a local server.

    congthien

    (@congthien)

    9 years, 4 months ago

    Hi @waveman777,

    I hope you can move it in live site soon, then I will help you take a look 🙂

    Thread Starter waveman777

    (@waveman777)

    9 years, 4 months ago

    Hi @congthien,

    Do you mean you cann’t help me with this? I cannot go live with the site like this until it works as intended. I haven’t changed anything that would affect how the theme behaves in therms of styling, so I think you can easily replicate the problem by adding some images instead of icons in the featured section.
    The images I used are 301x400px and scaled down by the onepress theme automatically to 120x159px.

    Is there any specific information I can give you to help?

    congthien

    (@congthien)

    9 years, 4 months ago

    Hi @waveman777,

    It is very hard for me without your site url to check. You can upload in live server and use maintenance wordpress plugin. You still could work and no one can see content site.

    Let me know!

    Thread Starter waveman777

    (@waveman777)

    9 years, 4 months ago

    Could you please at least try to help help me? I cannot move it to a live server yet, and I don’t get how this could help you. This is your theme and you have full access to it, I haven’t touched the original CSS file, so all you need to do is to take a look at the code I guess, don’t you have a copy of it installed for testing? If not, I can install one on my private domain just so you can take a look.

    Thread Starter waveman777

    (@waveman777)

    9 years, 4 months ago

    Ok, here is a testing site:

    http://hermanowkatest.itdiffers.com

    Please check “Our Services” section.

    • This reply was modified 9 years, 4 months ago by waveman777.
    • This reply was modified 9 years, 4 months ago by waveman777.
    Thread Starter waveman777

    (@waveman777)

    9 years, 3 months ago

    It’s been almost 5 days without any response, could you please help me?

    I’d really appreciate it.
    Thank you

    jpeter30000

    (@jpeter30000)

    9 years, 3 months ago

    This will make it look nice if you’re taking a mobile-first approach.
    Cheers, JP

    .section-services .service-item .service-image {
    float: none;
    margin-bottom: 30px;
    margin-top: 10px;
    margin-right: 0px;
    text-align: center;
    }

    .service-content {
    text-align: center;
    }

    @media (min-width: 992px) {
    .col-sm-6.col-lg-4.wow.slideInUp {
    width: 33.333333%;
    }
    }

    @media (min-width: 544px) {
    .col-sm-6.col-lg-4.wow.slideInUp{
    width: 100%;
    float: center;
    }
    }

    Thread Starter waveman777

    (@waveman777)

    9 years, 3 months ago

    Thank you @jpeter30000, but unfortunately this isn’t what I’m looking for. By default the theme works good on mobile devices, and it also looks good on big windows. The problem is with a services section on narrower sizes.

    @congthien, would you mind taking a look?

    Thread Starter waveman777

    (@waveman777)

    9 years, 2 months ago

    @congthien, could you please help me with this? It’s been over a month and I’m still stuck with this.

    Regards

Viewing 11 replies - 1 through 11 (of 11 total)

The topic ‘Services section – alignment problem’ is closed to new replies.