CODEWITHSUNDEEP
htmlcss
DANIEL
DANIEL

Reputation: 547

CSS - How I can cut the height footer

I'm having a issue with a footer in my page.

I have 2 divs - One with a black background, and other with a White background and a image (with transparent background) where the image is over 50% the black background and 50% over the White background.

To make this effect I create a style:

.divimage {
position: relative;
top: -110px
}

Then, The image goes -110px over the black background.

ok?

But, with this I have a 110px height of White background under the image now.

There is a way to cut this "extra" 110px out?

I tried many options, nothing happens.

(tried: min-height, max-height, height..)

I create a JSFIDDLE to explain better.. https://jsfiddle.net/do1tn64h/

Its a simple html - and If you delete the style="position: relative; top: -110px" of container, the image will down and the footer will be perfect, ending at 2, 3 pixels of distance of the image.

but, with this style, the image goes up 110px over the black background, and now I have 110px of White space under...

Upvotes: 1

Views: 115

Answers (1)

murli2308
murli2308

Reputation: 3004

Use

margin-top:-110px; instead of top:-110px;

Also use z-index if you want to make it up.

udpated fiddle https://jsfiddle.net/do1tn64h/1/

Upvotes: 1

Related Questions