Making a box more translucent and having photo span the site

  • Unknown's avatar

    There’s two things that I am looking to accomplish using customized CSS on the home page of my dreamfitbefit.com :

    1.) The main photo doesn’t span the entire width of the site. I’d like it to go all the way across to the right. How can I do this?

    2.) I’d also like to make that white box on the front picture more translucent, and not as white. so you can see the main picture behind…..is there a way to do this as well?

    Thanks for your help!

    Danielle

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar

    Found this in Sela’s docs:

    The featured image on the front page and on pages works best with images at least 1180 wide.

    https://wordpress.com/themes/sela

    Looks like your featured image isn’t wide enough — it’s only 1004px wide, which is why it’s not taking up the full width. You can stretch it by adding this css:

    .hero-content > img { width: 100%; }

    To make the white box more translucent, you can use this:

    .front-page-content-area .with-featured-image { opacity: .8; }

    Just replace the .8 with however translucent you want it. “8” means “80% opaque.”

  • Unknown's avatar

    Thanks :)

    It worked :)

  • The topic ‘Making a box more translucent and having photo span the site’ is closed to new replies.