[Slackbuilds-users] Testers wanted for new slint installers

Didier Spaier didier.spaier at epsm.fr
Wed Apr 2 09:10:35 UTC 2014


On 31/03/2014 23:19, Miguel De Anda wrote:
> Here's a quick fix for mobile -- only tested on home page but it should work throughout if the layout doesn't change much:
>
> add this to the end of slint.css:
>
>
> @media (max-width: 640px) {
> #layout-menu-box {
> position: inherit;
> left: inherit;
> top: inherit;
> width: inherit;
> height: inherit;
> z-index: inherit;
> }
>
> #layout-content-box {
> margin-left: inherit;
> }
>
> #layout-menu div {
> display: inline;
> }
> #layout-menu div a {
> display: inline-block;
> padding: 0 10px 0 0;
> }
> #layout-menu #page-source {
> border: none;
> }
> }
>
> then add this meta tag to the head of each .html file:
>
> <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
>
> it ends up looking like this:
>
> http://home.thedeanda.com/slint.fr/ (link will only be available for a few days)
>
> to test, check on your mobile (only tested android) or make your browser window a bit narrower, it collapses the left column up to the header and makes it so you don't have to zoom on your phone.
>
> have a lot of fun!

Thanks Miguel!

I also tried:
@media handheld
because it's valid CSS 2.1, but no luck on an Android phone, so I adopted your solution and rebuilt the website accordingly.

I'll have ask one of my sons to check on his Iphone to be sure, but so far, so good. I assume that all modern browsers are CSS 3 aware.

Thanks again,

Didier




More information about the SlackBuilds-users mailing list