|
cperez35
|
March 15, 2019 at 1:39 pm
I need help in customizing the CSS Style sheet to get the Table view for Event Epsresso 4 to work correctly on a IOS mobile device. An example page would be http://academyflorida.kinsta.cloud/courses/isc2-cissp-certified-information-systems-security-professional-boot-camp/
If you click on the “Schedule Tab” on a mobile device the table is cut off not allowing the user to enroll. The table does look fine if you hold the phone horizontally but is cut off if you hold the phone vertically.
|
|
Josh
|
March 15, 2019 at 2:50 pm
Hi,
You can first override the theme’s styles where it adds 80px for margins and padding to the list of dates:
.ee-table-view-datetime-list {
padding-left: 0;
margin-left: 0;
list-style-type: none !important;
}
Then add this breakpoint to override the other stylesheet’s margins and padding to give the table enough space on small screens:
@media (max-width: 460px) {
.vc_tta-panel-body .espresso-table {
margin-left: -14px;
}
#learn-press-course {
padding: 0;
}
.lpcourse-main .col-md-8 {
padding: 0;
}
}
|
