News Pro: Featured Tabs Resize

Community Forums Forums Design Tips and Tricks News Pro: Featured Tabs Resize

This topic is: resolved

This topic contains 6 replies, has 3 voices, and was last updated by  jsride 1 year, 1 month ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #94011

    dcreative
    Participant

    Hi Everyone,
    Using News Pro here: http://www.okanagansportspage.com

    Client wants to have a large square image (740×740) which is fine, it’s his site, but changing the css/functions files to accomodate this ruins the mobile css causing a large blank space below it. So, on mobile theres a 740px column so the smaller images on mobile leave the empty space below.

    If anyone can lead the way it would be great. I can get some screenshots if need be.

    Cheers,
    Steve

    http://www.okanagansportspage.com
    #95676

    danicalc
    Participant

    Hi Steve,

    Are you able to explain to me where you went to change the main image size to 740×740, and were you able to fix the issue mentioned above? I’m having trouble location the function for this.

    Thanks!

    #95709

    dcreative
    Participant

    Hi Danicalc,
    I did indeed find a solution for it. I added the following CSS to the theme settings under “Header & Footer Scripts”:

    .home-top .widget.ui-tabs .entry {
    min-height: 740px;
    }
    @media only screen and (max-width: 1023px) {
    .home-top .widget.ui-tabs .entry {
    min-height: inherit;
    }
    }

    The first part extends the home-top box to allow the larger image, the media query resets the box size for smaller screens as without it the home-top box ends up with a massive amount of empty space below the feature image.

    #96437

    danicalc
    Participant

    Thank you Steve! I hadn’t see your reply till now.

    #98456

    jsride
    Participant

    I’m trying to only have one category picture show on the front as well and need to remove the category tab. How did you remove the category tab from the bottom?

    #98478

    danicalc
    Participant

    Hi!

    I believe I set:

    .home-top .ui-tabs ul.ui-tabs-nav {
    display:none;
    }

    to to remove the tabs.

    Hope this helps!

    • This reply was modified 1 year, 1 month ago by  danicalc.
    • This reply was modified 1 year, 1 month ago by  danicalc.
    #98572

    jsride
    Participant

    That did the trick…..thanks!

    Rick

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

You must be logged in to reply to this topic.