Hello,
You are right, it’s the plugin slider that is causing the mobile issues.
It’s created using tables which makes it very hard to style differently on mobile devices.
– Jesper
OK Thanks and fast response! Maybe I will try the slideshow on the left side of home page table and see if that helps. I will look into that in next 24 hours. Karlopa
Hi Karlopa,
I took a look at the code and you are using tables in the content to create the 2 column look.
You will either need to create media queries for the tables or for better responsiveness and proper layout you should use <div> mark up to create your columns and follow along with the themes responsive CSS selectors.
Or for something less code involved you can use a page builder like Visual Composer or a free one https://ww.wp.xz.cn/plugins/siteorigin-panels/.
Hope that helps!
* Never mind posted too late you already have a response 🙂
Jesper, is there a way that I can have a table layout on the home page, that will look the correct width on a mobile device as well as a computer screen?
Here is the custom code I have for the site.
tablehome {
width: 100%;
margin: 0 0 25px 0;
background-color: #ffffff;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.07);
border-left: 1px solid #dddddd;
border-right: 1px solid #dddddd;
border-collapse: collapse;
border-spacing: 0;
}
tablehome th,
tablehome td {
padding: 8px;
border: 1px solid #dddddd;
text-align: left;
}
tablehome thead th {
background: #f7fafd;
border-left: 1px solid #e9f2f7;
}
tablehome th {
font-weight: bold;
}
#main .tablehomeBG {
background-color: #666;
color: #ccc;
width: 400px;
}
