Tagged: , , , ,

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • August 4, 2016 at 9:07 am #668443
    August 5, 2016 at 6:29 am #668845
    evan_friedl

    btw on regular mobile when in landscape the icons on the who we serve page are not centered either. :) I am sort of blah about it. lol

    August 9, 2016 at 5:16 am #670150
    Ismael

    Hi,

    But for some reason safari they are not centered on this page.

    Please add the custom css code:

    .center-icon .iconbox_icon {
    left: 52% !important;
    transform: translateX(-52%);
    -webkit-transform: translateX(-52%);
}

    And remove this one:

    .iconbox_icon {
left: 43% !important;
}

    So my next problem is the logo on my website in general . My client hates that when you zoom on any browser on regular and device it ends up all pixelated while the rest of the site is all nice and sharp. Any advice on how I can fix that problem?

    Upload a larger logo image, maybe twice or thrice the size of the current one. http://srea.co/wp-content/uploads/2016/08/SREA-Logo-340.png

    Best regards,
    Ismael

    August 10, 2016 at 1:50 am #670566
    evan_friedl

    So the top icon is now mostly centered but the two below it are not even close on all browsers.. I know for mobile phones I will have to make a few minor adjustments to the percentages because all three are off on mobile phones. I just want to get a little closer first.

    should I separate .iconbox_icon ?

    I had already tried making the logo larger but he hated how the logo looked bigger. Any other ideas?

    Thank you for the help so far.

    August 12, 2016 at 9:53 pm #672082
    Andy

    Hi,

    for mobile phones you’d need to add media queries to the code, for example: 

    @media only screen and (max-width: 736px) {
.center-icon .iconbox_icon {
    left: 52% !important;
    transform: translateX(-52%);
    -webkit-transform: translateX(-52%);
}
}

    A mockup showing what you want to achieve would help us a lot. Please use imgur.com or dropbox.

    Best regards,
    Andy

    August 15, 2016 at 9:03 pm #672870
    evan_friedl

    A mock up would not really help. The icons need to be centered on the top of the boxes on all types of browsers.

    I am grateful for your help. You have helped me a ton in the course of editing this website.

    These icons in particular have been a thorn in my side. They are not centering no matter what I do. So if you look at the Who We Serve on a desktop and on mobile browser as well as an ipad.

    The top box and the two boxes below with icons on top. on desktop the icon is close to center. But on all other browsers not even. And when you look at it on a phone the first box icon is off center to the left and the other two are off center to the right. It looks terrible.

    I have tried several things to try to get them to align and I am pretty frustrated and that is why I asked for help.

    August 16, 2016 at 1:29 pm #673198
    Andy

    Hi,

    use this code:

    @media only screen and (max-width: 736px) {
.iconbox_icon.heading-color {
margin-left: 0px;
}}

    and adjust as needed.

    Best regards,
    Andy

    August 16, 2016 at 9:36 pm #673400
    evan_friedl

    Just to clarify instead of the other code or with the other code?

    August 18, 2016 at 5:48 pm #674280
    Andy

    Hi,

    I think both. Try it out by yourself and check out which works for you and which doesn’t.

    Best regards,
    Andy

  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.