how to popup in center of screen by CSS

Hi ,
please see the attached sample , when I click the "question" in how to popup in center, it popup in right of screen  , how can it popup in center of screen?

it is better to change by CSS

jquery is also good
sample.zip
GordonLiqAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
Edwin HofferConnect With a Mentor Technical ExpertCommented:
I tried to do some some changes, hope it will be fine now.
sample-1-.zip
0
 
Edwin HofferTechnical ExpertCommented:
Hello Gordon,

Please find the attached file, I tried to solve the question.

If you still need any help, feel free to ask.

Thanks
Edwin
sample.zip
0
 
Edwin HofferTechnical ExpertCommented:
If you want to change the position of the box, change left and right position in "tipsexplain" class
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
GordonLiqAuthor Commented:
Hi,
thank you ,
It works , but the problem is the width of popup is dynamic , so if I limited the left or right , for some popup , the width may not enough , for other , may left lot of blank at right side like the attachment.
2014-12-14-20-08-06.png
0
 
Edwin HofferTechnical ExpertCommented:
Sorry, but i can't get you correctly. Can you pleas explain little more?

Do you want the content to show in left side?
0
 
GordonLiqAuthor Commented:
the popup text is dynamic , so the width of the popup window is not fixed as well , said my screen is 1920x1080 and if I set the left : 10% , right 10% ,     the popup window will be fixed to about 1500px ;
then if my popup window only width 500px ; it will still have a popup window at 1500px ; but the text inside the windows only used 500px , the right side will has 1000px blank , I want to make the popup window's width fit the text if possible , to eliminate the blank area at right side.
0
 
Edwin HofferTechnical ExpertCommented:
I think you are talking about the inner content of the body.

I tried to do this.

If you still need any changes, let me know.

Thanks
Edwin
sample.zip
0
 
GordonLiqAuthor Commented:
please check this sample , this is what I said not fit for auto width with blank
sample-1-.zip
0
 
Edwin HofferTechnical ExpertCommented:
I have attached the edited file, if you still need any changes let me know.

Thanks
Edwin
sample-1-.zip
0
 
GordonLiqAuthor Commented:
Hi Edwin,

thank you ,
but the scroll bar is not on right side of popup window , it located in somewhere middle,

the solution will be better if one of these
make the popup window fit the width of content , narrow down in this sample.
or
make the scroll bar on right side of popup window.
0
 
GordonLiqAuthor Commented:
thank you ,
scroll bar now in correct position
0
 
Edwin HofferTechnical ExpertCommented:
You are most welcome :)
0
All Courses

From novice to tech pro — start learning today.