New Landing › How can we help? › Themeforest Theme Support › Dante › Icon Box minimum height

Tagged: ,

  • This topic has 26 replies, 5 voices, and was last updated 5 years by outlawzz.
Viewing 15 posts - 1 through 15 (of 27 total)
1 2
  • Back to forum
    Posted in: Dante
  • October 8, 2014 at 3:02 am #118337
    hamlik2002
    Member
    Post count: 93

    I was just wondering… would it be possible to add a minimum height to icon boxes so that when they are resized to a tablet screen all of their heights would be equal…? Or what is a good fix for it…? I’ve attached a pic.

    Attachments:
    You must be logged in to view attached files.
    October 8, 2014 at 9:06 am #118411
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Hi

    Looks like you managed it? (see screenshots)

    – Kyle

    Attachments:
    You must be logged in to view attached files.
    October 8, 2014 at 5:17 pm #118641
    hamlik2002
    Member
    Post count: 93

    That’s the top part… I’m talking about the footer… And the top part is like that because I made sure the sentences and words I used are approximately the same length… Sometime that is not possible just like the footer. So the boxes result in mismatch of heights when the windows is resized.

    October 9, 2014 at 8:08 am #118733
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Add this to your custom css:

    @media only screen and (max-width: 1200px) { 
#footer-widgets .sf-icon-box-boxed-three .sf-icon-box-content-wrap {
  min-height: 277px;
}
}

    – Kyle

    October 21, 2014 at 12:44 am #121725
    fmora617
    Member
    Post count: 105

    Hi Kyle –

    I have a similar question as well. I am trying to:
    1) Reduce the right side of the icon box. I am looking to have it the same margin as the left side of the icon box.
    2) Then I would like to center the box (justify center), not the text
    3) Lastly, is it possible to remove the icon? Will this effect other icon boxes where I have icons.

    Screenshot –> http://i.imgur.com/0F7j4SB.png

    The page where I am seeing this is: http://dev.fmora.com/?page_id=12217

    Thanks!
    Fabian

    October 21, 2014 at 9:11 am #121821
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Hi

    1 & 2) Reduce the width of the icon box to 1/2, then in the extra class field add ‘col-md-offset-3’

    3) What is the point of using an icon box? Just use the ‘boxed content’ asset instead

    – Kyle

    October 21, 2014 at 12:09 pm #121921
    fmora617
    Member
    Post count: 105

    Hi Kyle –

    I thought about using the boxed content, but then how would I be able to add an asset background to a boxed content?

    Fabian

    October 21, 2014 at 12:20 pm #121928
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Ahh yes. Ok to remove the icon on an icon box ass this to your custom css:

    .sf-icon-box h3 > i {
  display: none;
}

    – Kyle

    October 21, 2014 at 10:48 pm #122115
    fmora617
    Member
    Post count: 105

    Hi Kyle – if I want it to have it affect just one page is this CSS correct?

    .page-id-12217 .sf-icon-box h3 > i {
    display: none;
    }

    Site page is http://dev.fmora.com/?page_id=12217

    Fabian

    October 21, 2014 at 11:10 pm #122121
    Rui Guerreiro – SUPPORT
    Keymaster
    Post count: 25779

    Hi,

    Yes, that’s it.

    -Rui

    October 21, 2014 at 11:55 pm #122134
    fmora617
    Member
    Post count: 105

    Hi –

    I reduced the width of the icon box to 1/2 using:

    .page-id-12217 .sf-icon-box[class*=”sf-icon-box-boxed-“] .sf-icon-box-content-wrap {
    width: 40%;
    padding: 40px 30px 15px 30px;
    }

    This worked fine.

    I then added ‘col-md-offset-3’ to the extra class field and it did not center justify the box. Any ideas?

    Thanks,
    Fabian

    October 22, 2014 at 7:54 am #122208
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Why did you reduce the icon box to 40% using CSS? All you need to do is click the arrow for the page builder asset and it will reduce width

    – Kyle

    October 22, 2014 at 1:28 pm #122356
    fmora617
    Member
    Post count: 105

    Hi Kyle –

    Ok, I removed the 40% width CSS. I then clicked the arrow in the page builder to 1/2, but it resulted in this (cutting the whole page in half) –> http://i.imgur.com/gjPmtYM.png

    I also tried entering [one_half] [/one_half] in the editor for the icon box only and had no luck as well.

    What I am trying to do is have the box center justified on the page like the red box here –> http://i.imgur.com/rKDy5bD.png

    Any other ideas?

    Thanks,
    Fabian

    October 22, 2014 at 1:31 pm #122359
    Kyle – SUPPORT
    Moderator
    Post count: 35880

    Please provide me with a link so I can set it up for you the correct way. You’re supposed to use the icon box page builder asset

    – Kyle

    October 22, 2014 at 2:18 pm #122374
    fmora617
    Member
    Post count: 105
    This reply has been marked as private.
  • Back to forum
    Posted in: Dante
Viewing 15 posts - 1 through 15 (of 27 total)
1 2

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register