WebSite X5Help Center

 
Michael Ludwig
Michael Ludwig
User

Tables Not Scrolling and Over the Edge when viewed in mobile  en

Autore: Michael Ludwig
Visite 1034, Followers 1, Condiviso 0  

I had a great response to my comment https://helpcenter.websitex5.com/it/post/256430 and using the fix given was able to amend each table as i wanted.

I went to do the same on another page

https://www.craigynoscastleweddings.com/wedding-competitor-prices.html 

The page is fine until view on a mobile and what happens is that the table retains its position (there are 6 tables) one after the other and the first table seems ok (until you add others in) see https://www.craigynoscastleweddings.com/x.html but when you add multiple tables in (as objects) there is a massive white gap to the right of the table.

I had thought about having one great big table, but am unsure if this will resolve the issue.

I have tried the code as

<style>

@media (max-width: 400.0px) {

#imTableObject_472_544 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_549 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_546 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_551 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_547 {

display: block;

overflow-x: auto;

}

}

</style>

That didnt work as i found i had missed out one table, so tried again with the missing table.

Then, tried:

<style>
@media (max-width: 479.9.0px) {
#imTableObject_478_544 {
#imTableObject_478_545 {
#imTableObject_478_549 {
#imTableObject_478_546 {
#imTableObject_478_551 {
#imTableObject_478_547 {

display: block;
overflow-x: auto;

}

</style>

So my final try which can be seen at https://www.craigynoscastleweddings.com/y.htm

Still makes no sense but contains the cod

<style>

@media (max-width: 400.0px) {

#imTableObject_478_544 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_545 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_549 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_546 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_551 {

display: block;

overflow-x: auto;

}

}

</style>

<style>

@media (max-width: 400.0px) {

#imTableObject_478_547 {

display: block;

overflow-x: auto;

}

}

</style>

Postato il
1 RISPOSTE - 1 UTILE - 1 CORRETTO
Aleksej H.
Aleksej H.
Moderator

Hello. I already answered this question yesterday. Did my advice help you?

Leggi di più
Postato il da Aleksej H.