css - Background image not covering the whole space -
i sure missing simple, can't seem find it.
on michelleforboe.com, trying background image cover whole space of div. using calc set height of div, div resolving higher should be. also, if scroll down & up, black bar @ bottom of image larger. there div sitting on top of image; had thought maybe causing space, don't think is. see missing?
.home-section-1 .wrap { margin-left: 0; } .home .site-inner { margin-top: 140px; } .home-section-1.widget-area { background-size: 100% calc(100vw/2.9); background-position: 50% 50%; height: calc(100vw/2.9); padding-top: 0; padding-bottom: 0; } #text-7 { height: calc(100vw/2.9); } #text-7 .widget-wrap { height: 100%; position: relative; } #text-7 .widget-wrap .textwidget { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #text-7 a.button { font-size: 2vw; padding: 1vw; } .home-section-1 .widget-wrap { width: 50%; }
try css
.home-section-1.widget-area { background-size: cover !important; background-position: 50% 50%; height: auto; padding-top: 0; padding-bottom: 0; } if u wanna full screen of image remove height css
.home-section-1.widget-area { background-size: cover !important; background-position: 50% 50%; padding-top: 0; padding-bottom: 0; }
Comments
Post a Comment