1st Full + List layout image and text adjustment

  • Posted in : TheBlogger
  • nerwin
    Participant

    Hello again. Thanks for all your help, I appreciate it.

    So I have my homepage setup using the 1st Full + List layout and while I really like this setup, I’m finding the featured images of blog list below the regular full post a little too big for my taste.

    Instead of square crop, I’d like to make it 3:2 crop instead. Now I can get them to resize the way I want but it also changes the full size featured image above and I don’t want that and I can’t see to figure out how to target just the blog list and not the full post above.

    The only other thing I wanted to do was align the text, entry title and meta to left instead of the middle. I managed to get that working for the full post above no problem. Just wish the excerpt was bigger but I assume you are working that for the next update.

    Thanks!

    serkan
    Moderator

    Hi,
    This custom css code for the regular post in the first full blog type. If something effects the first one, then you can change it.

    @media screen and (min-width: 768px) { .blog-list.first-full .hentry:first-child .hentry-middle { codes here } }

    Thanks

    nerwin
    Participant

    Well I can make it work with this code:

    @media screen and (min-width: 992px) {
    .blog-list .featured-image {
    width: 275px;
    padding-top: 184px; }
    }

    The problem is when I go mobile view, it goes back to square. I’m having a hard time figuring that one out.

    serkan
    Moderator

    I just replied the reason. One of your custom css code effecting your mobile view.
    You need to close the media codes with double quotes.

    nerwin
    Participant

    I’m already using that exact code but still can’t get the small feature images to resize on mobile.

    nerwin
    Participant

    The other issue is trying to align the entry headers.

    I want the single full blog post to align center which it is right now, but I want the smaller blog list below to have the entry header aligned left not center.

    Ok. I did manage to get this to work, I just had to add first child which worked perfect.

    For anyone who is wondering, I used this code:

    .blog-list.first-full .hentry:first-child .entry-header {text-align: center;}

    Which allowed me to keep the first entry of the 1st full + list layout entry header in the center and be able to align the list entry headers to the left.

    nerwin
    Participant

    Well the images are not resizing properly. I’m not sure what I can do to make them smaller.

    serkan
    Moderator

    Hi,
    Could you explain it to me, please ? It looks like 3:2 crop featured image. Which part is not working for you?
    Thanks

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

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

License required for the following item
Login and Registration Log in · Register