WordPress.org

Ready to get started?Download WordPress

Forums

Church
[resolved] Headre IMage Alignment (20 posts)

  1. TannerFresh
    Member
    Posted 5 months ago #

    Hey guys my website, http://tannerfresh.com displays the header image below my navigation bar to be slightly short on the right side no matter what I try. Any suggestions?

  2. vtxyzzy
    Member
    Posted 4 months ago #

    The problem is that '.banner img' is styled 'max-width: 100%;', but 'img' is styled 'width: auto;' which adjusts the width of the image in proportion to the height.

    You need to override the '.banner img' styling with this:

    .banner img { width: 100%; }

    You should create a Child theme to make your changes. If you do not, all of your changes will be lost if you update your theme.

  3. TannerFresh
    Member
    Posted 4 months ago #

    I made the above changes and had no luck with the banner img problem being corrected.

  4. vtxyzzy
    Member
    Posted 4 months ago #

    Your site looks correct to me now. You may need to clear your browser cache.

  5. TannerFresh
    Member
    Posted 4 months ago #

    Ya it did correct itself but unfortunately now my images for blog posts are extremely distorted.Do you know why that might be?

  6. vtxyzzy
    Member
    Posted 4 months ago #

    Something else has changed because taking out the change I suggested still leaves the banner expanded.

  7. TannerFresh
    Member
    Posted 4 months ago #

    I mean I'm alright with them being that size but if they didn't become so pixaleted and blurry at the same time that would be nice. They used to be 1/3 the size of what they are now.

  8. vtxyzzy
    Member
    Posted 4 months ago #

    OK, try adding this to your style.css:

    .entry-content img.medium,
    .entry-content img.thumbnail {
       width: 200px;
    }

    EDIT: Probably better to use a percent: width: 35%;

  9. TannerFresh
    Member
    Posted 4 months ago #

    I added that near the bottom of styles.css but had no luck with the pictures changing size, even after clearing the cache. I really do appreciate all your help!

  10. vtxyzzy
    Member
    Posted 4 months ago #

    Where did you add the code? When I go to the site, I do not see it at the end of wp-content/themes/church/style.css.

    You really should create a Child theme to make your changes. If you do not, all of your changes will be lost if you update your theme.

  11. TannerFresh
    Member
    Posted 4 months ago #

    I am alos running the "Video Thumbnails" plugin by Sutherland Boswell so maybe that has something to do with I'm not sure, I temporarily deactivated it but still had no luck.

  12. TannerFresh
    Member
    Posted 4 months ago #

    Sorry I'm not sure how to create a child theme yet. I put it in the code like such:

    @media screen and (max-width: 600px) {
    #respond input[type="email"],
    #respond input[type="text"],
    #respond input[type="url"] {
    width: 100%
    }
    }

    `.entry-content img.medium,
    .entry-content img.thumbnail {
    width: 35%;
    }

    /*
    Plugins Style
    ---------------------------------------------------------------------------------------------------- */

    /* Jetpack
    --------------------------------------------- */
    input#subscribe-field {
    padding: 16px !important;
    }

  13. TannerFresh
    Member
    Posted 4 months ago #

    ONce I have a child theme How am I supposed to update it?

  14. vtxyzzy
    Member
    Posted 4 months ago #

    I see it now. You included the backtick at the front of the code (I accidentally left off the trailing one, so it showed up at first). Just remove that first character.

  15. vtxyzzy
    Member
    Posted 4 months ago #

    You keep the parent theme pristine and make your changes in the child theme. The parent theme can then be updated without losing your customizations.

    So, you would place your CSS changes in your child theme's style.css.

  16. TannerFresh
    Member
    Posted 4 months ago #

    Perfect thank you for all the help, finally go it figured out! I had some experience with visual basic coding but not this stuff so some of it goes right over my head. I'm going to have to read up on how to make a child theme here.

  17. TannerFresh
    Member
    Posted 4 months ago #

    Also my picture in my bio is now large and distorted. (http://tannerfresh.com/bio/)
    and on all the posts for every post-page example: (http://tannerfresh.com/tanner-fresh-interview-mixed-tape-magazine/)
    (http://tannerfresh.com/saskatchewan-roughriders-playoffs/)

  18. TannerFresh
    Member
    Posted 4 months ago #

    Just wondering if anybody have a suggestion for this? Because the original fix was for a minor problem but has since then messed up my entire website!

  19. vtxyzzy
    Member
    Posted 4 months ago #

    Everything looks right to me in FF and IE10. Did you clear your cache?

  20. TannerFresh
    Member
    Posted 4 months ago #

    Ya I forgot to do that, slipped my mind again. I was getting all worked up over this, that should work.Thanks.

Reply

You must log in to post.

About this Theme

About this Topic