Hi,

I need to create a mobile friendly version of a skin for a particular client.  I've run in to a couple of issues, the biggest of which is that I can't seem to get my mobile skin to stop rendering the left column!  I don't need the left column to appear on my mobile skin so as to allow the centre column to take up the full width of the screen.  On the 'desktop' skin the left column needs to render.  I've managed to get the left column to collapse with the following:-

.art-content-layout .art-sidebar1
{
  width: 0px;
  display:none;
}

However I get different behaviour depending on the platform.  In IE10 on Win 7 if I force use of my mobile skin all is well - the column collapses and any content is not shown.  However in Chrome and on a iPhone and Android phone I am finding that any content in the left column is rendered, and has the centre column content over the top of it.  See http://wwwtest.effectiveintelligence.com/home.aspx?Skin=EIMobile_2385.  I have tried various bits of css to hide the content at various levels, all to no avail.  So any clues here would be very helpful!

I have plenty of other issues with the content itself, a lot of which doesn't fit the mobile skin due to images that are too wide etc.  So I was thinking about using the Mobile Kit Pro.  What I need to know is how far I can tweak its skin.  I need to generate a layout that is basically as per the link above (and it is pretty simple).  I think I read that you need to use jQuery theme roller to alter the layout.  I have played with this and didn't get on all that well with it!  How much can I just tweak in css and html? If I can replicate my skin and gain all the other advantages of the Mobile Pro Kit then it is probably the way to go.

Thanks.