Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #169672

    Hi there!

    I’ve just updated to Angular 1.7 so my sliders are working again. Yay!

    I am scratching my head now as I can’t figure out what my work around was for getting those portfolio titles and thumbnails to line up all in a grid. Currently some titles take up two lines which pushes the entire container down a notch. How would you suggest resolving this?

    Site is here: http://recollective.ca/projects/

    I’ve seen suggestions to add custom css file that would cut the title off and add some ellipses… I’d prefer an option that keeps the full project title.. to 2 lines at least!

    Many thanks!

    Sarah

    #169702

    Hey Sarah!

    Try this CSS code:

    .post-title.portfolio-title {
    min-height: 32px;
    }

    Best regards,
    Josue

    #169789

    This code worked great for the portfolio titles. Is there a way truncate the number of characters from the excerpt field in order to keep the portfolio heights the same? Or, is there some CSS that would keep the min-height the same value for each row?

    Things still look a bit funky on my portfolio page and I would like to see if this can be fixed with code before I start trying to re-write my portfolio excerpts to all match up.

    http://beta.designinsidechicago.com/portfolio/

    #170003

    Hi @designinside!

    Try with this:

    .inner-entry .grid-content {
    min-height: 165px;
    }

    Cheers!
    Josue

    #170038

    Hi @Jouse, that didn’t work. Also, I just noticed that this thread was related to the Angular theme. I’m using Enfold. Sorry for the mixup, the search always throws me off since it retrieves results for all themes, not just the one you have selected at the time.

    Do you want me to post another question in the Enfold forum thread?

    #170062

    Hey!

    Not necessary, try with this code:

    .inner-entry .grid-content {
    min-height: 165px !important;
    }

    Regards,
    Josue

    #170069

    Thanks Josue, that code worked well. However, now on any pages where I don’t show the excerpt (http://beta.designinsidechicago.com/), there is a 165px blank space. Do you have a workaround for this?

    #170150

    Hi!

    This code will apply only to the excerpt, if there is no excerpt, it won’t:

    .grid_content .grid-entry-excerpt.entry-content {
    min-height: 105px;
    }

    Regards,
    Josue

    #170166

    Hi Jouse, it doesn’t appear that the latest CSS code does anything. I even tried a combination of the old codes and I still get the same results. If you look at: http://beta.designinsidechicago.com/portfolio/, you will see that the 3rd entry on the top row (Modern Wrigleyville Home Office and Den) has an exxcerpt field that is shorter than the other entires. I set the min-height: 190px, so I would think that the cell would have a height of 190px regardless of how much text is in it.

    Thanks again for all of your help today.

    Currently, my style.css file (in my child theme) looks like this:

    /* configure set height for portfolio caption titles
     * http://www.kriesi.at/support/topic/portfolio-titles-2/
     */
    .main_color.inner-entry .grid-content {
    min-height: 60px;
    }
    
    /* configure set height for portfolio excerpt 
     * http://www.kriesi.at/support/topic/portfolio-titles-2/#post-170150
     */
    .grid_content .grid-entry-excerpt.entry-content {
    min-height: 190px;
    }
    
    /* Configure set height for portfolio images
     * http://www.kriesi.at/support/topic/portfolio-grid-sizing-and-spacing-issues/ 
     */
    .grid-image.avia-hover-fx {
    min-height: 190px;
    }
    
    .grid-image.avia-hover-fx img {
    min-height: 190px;
    }
    #170174

    Hi!

    Sorry there was a little typo in the .grid_content class, here’s what the final code should look like:

    /* configure set height for portfolio caption titles
     * http://www.kriesi.at/support/topic/portfolio-titles-2/
     */
    .main_color.inner-entry .grid-content {
    min-height: 60px;
    }
    
    /* configure set height for portfolio excerpt 
     * http://www.kriesi.at/support/topic/portfolio-titles-2/#post-170150
     */
    .grid-content .grid-entry-excerpt.entry-content {
    min-height: 190px;
    }
    
    /* Configure set height for portfolio images
     * http://www.kriesi.at/support/topic/portfolio-grid-sizing-and-spacing-issues/ 
     */
    .grid-image.avia-hover-fx {
    min-height: 190px;
    }
    
    .grid-image.avia-hover-fx img {
    min-height: 190px;
    }

    Regards,
    Josue

    #170297

    I put in a few more tweaks and I think I got it working. Here is my final code. Thanks again for all of your help.

    /* configure set height for portfolio caption titles */
    .grid-content .grid-entry-title.entry-title {
    	min-height: 30px;
    }
    
    /* configure set height for portfolio excerpt 
     * http://www.kriesi.at/support/topic/portfolio-titles-2/#post-170150
     */
    .grid-content .grid-entry-excerpt.entry-content {
    min-height: 170px;
    }
    
    /* Configure set height for portfolio images
     * http://www.kriesi.at/support/topic/portfolio-grid-sizing-and-spacing-issues/ 
     */
    .grid-image.avia-hover-fx {
    min-height: 190px;
    }
    
    .grid-image.avia-hover-fx img {
    min-height: 190px;
    }
    
    #170300

    Glad we could help. Let us know if you have any other questions or issues :)

    Regards,
    Josue

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

The topic ‘Portfolio Titles’ is closed to new replies.