CODEWITHSUNDEEP
htmlcss
Itay
Itay

Reputation: 337

make "Close" button outside of a div

I have login button that is getting a little bit outside of the border of a div, but when I try to make it the same in the code it doesn't work.

.closeWindow{
    float: right;
    margin-left: 15px; /* width of the close button / 2 */
    margin-bottom: 15px; /* height of the close button / 2 */
}

Where I want it to be placed (The little image close-button): where it supposed to be placed

Where it actually placed: where it actually placed, using the css code that I wrote.

Upvotes: 4

Views: 4862

Answers (2)

Mudassir
Mudassir

Reputation: 1156

change the margin to a minus for example margin-left:-20px;. this will make the element move 20px to the right.

margin-left: -40px;  /*moves 40px right*/
margin-bottom: -20px; /*moves 20px up*/

This problem occured once with me and the best way to fix it is by using negative margins.

or you can use absolute positioning.

position:absolute;
left:value;
top:value;

Upvotes: 2

vico
vico

Reputation: 2142

do not use float

instead in your container div use

position :relative;

and in the close box div use these styles

position: absolute;
top: -15px;
right: -15px;

(given the fact that if your close button is 30x30)

Upvotes: 8

Related Questions