View on an Iphone or on an Android phone

manusch_hz

Hi,
A frind of mine pointed out, that the table on http://mathiaskusche.de/vita/ does not fit in a mobile device and it extends out of the white background area. That does not realy look good.

I wanted to ask, if there is a funtion (for example), that makes the whole background area white for mobile view.
Or should I increase the size of the table in some way that it fits to the screen of small mobile devices?

Do you have an idea to let the Vita page look professional, also in the mobile view?

Regards Manusch

Air

Hello,

Well responsivnes of tables is hard thing and we didn't add any rules for them. Anyway it wouldn't work as your tables have in-line styles that set your tables to width of 820px.
Go to HTML mode of editor and delete code like style="width: 820px;".

Next we can add some rules as you wish for tables to behave better. Add such custom CSS

.real-content table{
    width: 100%;
}
@media only screen and (max-width: 650px) {
.real-content table{
    background-color: #fff;
    font-size: 12px;
}
}

Add this rules, and then we will check what else we can do.

With regards.

manusch_hz

Hi Air,
now the view is better. I activated your css-code.
I let the style="witdh: 820px". Because I need the width in normal view with a normal computer. The view is also good in mobile view, because the table is filled with white color.
Do you know how I can make the whole background white for mobile devices?

Regards
Manusch

Air

Hello:-)

I think you could use this CSS

@media only screen and (max-width: 650px) {
html, body {
    background-color: #FFFFFF;
}
}

With regards.