Layout problem cause javascript calendar appear below

HTML & CSS
1

Dear All,
Can you visit this link http://183.78.169.54/v3/addTab.php then press the tab Drive Licenses and then press the pick button for the license expiry date and you will notice the calendar appear at the bottom. The problem if I put my codes in tab style then only this problem occur in normal case(without tab) is ok. I guess is some layout problem but dont know where is the cause of it.

2

I usually do not like using margin negatives, but in this case, I would try it. go ahead and add this code.


... style="margin-top: -300px" ...

excuse the dots and change 300 to whatever works.

Hope this helps
Matt,

edit: I see the following code might be an issue. Not completely sure though


top: 459px;
3

Dear Matt,
Which location must I exactly add this in the head section or build new style ?

4

I edited my post, There might be code which may be causing some issues.

the following code


<table id="epoch_popup_calendar" class="calendar" classname="calendar" style="position: absolute; [b]top: 459px;[/b] left: 187px; display: block; ">
5

Dear Matt,
I have added right at the top like this. Still the same.

<style>
top: 459px;

6

You have to take away the


top: 459px;

from


<table id="epoch_popup_calendar" class="calendar" classname="calendar" style="position: absolute; top: 459px; left: 187px; display: block; ">

or you need to choose a smaller value.

7

Dear Matt,
This is not part of my code but I guess is generated by the javascript or their .css file? Any idea where it comes from?

8

Dear Matt,
I guess is via their javascript .js file. But I dont find the 459 value in their source file.

9

Yup, that was my browsers fault. Don’t know why it is coming up. You can try taking away



#epoch_popup_calendar
 { 
top: 120px; 
}

from your style sheet.

10

Dear Matt,
Removed it still no luck. Is quite challenging eventhough a small matter I really lost hope you guys can see the light.

11

add this to the top of your css file for epoch


#epoch_popup_calendar {
margin-top: -300px;
}

Like said, I usually do not like using margin negatives, but in this case, It might work.

12

Dear Matt,
Great it works just need some aligntment slightly need to push to right a bit. Actually how is this margin-top: -300px; works I want to learn rather then just using it. Thank you.

13

Dear Matt,
If you are free can you explain the logic behind the margin-top: -300px;