CODEWITHSUNDEEP
jquerypopupmodal-dialogcss
Jake
Jake

Reputation: 1295

How to make a jQuery modal box display "on top" of page elements?

I'm currently developing a small jQuery popup modal box. I am using the toggleSlide() function which works well. However whenever I call the box it pushes all of the other content out of the way.

I've tried using position: relative; and display: inline; for CSS properties, but neither has worked.

Would love some insight from anybody who can help. You can view the code live on my demo site here: [REMOVED] Sorry but this demo was taken offline!

Upvotes: 1

Views: 2399

Answers (1)

tw16
tw16

Reputation: 29575

You need to add position:relative to .containmsg and then set your modal box to position:absolute adjusting the figures slightly to line it up perfectly.

.containmsg {
    display: block;
    float: right;
    margin-left: 50px;
    position: relative; /* add this */
}

.containmsg .mainComposeD {
    left: -33px;
    position: absolute; /* add this */
    top: 22px; /* add this */
}

Upvotes: 2

Related Questions