Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Andreas Gehrke 20 posts 44 karma points
    Sep 22, 2011 @ 15:09
    Andreas Gehrke
    1

    Tablet css enhancements for Our

    The css for our.umbraco.org contains a lot of fixed widths which means its doesnt scale properly on tablet or mobile with smaller screens.

    I have made the following css enchancements for devices with screens less than 990px wide. It doesnt cover the entire site but focuses mainly on the forum and wiki. It could be optimized further for mobiles though. Use if you want..

    @media all and (max-width: 990px) {
        .wrapper, #contentArea {
            width: 90%;
            margin: 0 auto;
        }
    
        body {
            background: none;
        }
    
        .forumList .latestComment {
            width: auto !important;
        }
        #forum table.forumList td.replies, #forum table.forumList td.votes {
            font-size: 12px;
        }
        #forum ul.commentsList li.post .comment {
            width: auto;
            margin-left: 80px;
            float: none;
        }
    
        #forum #commentBody_parent, #forum #topicBody_parent {
            width: 99%;
        }
    
        /* projects*/
        #projectDescription {
            width: auto !important;
        }
        #forum {
            width: auto !important;
        }
    
        /* wiki */
        .projectGroups li div {
            width: auto;
        }
        .projectGroups li {
            width: 48%;
        }
        #wiki #options {
            width: auto;
        }
    
        /* People */
        .spotlight {
            width: 45% !important;
        }
    }
Please Sign in or register to post replies

Write your reply to:

Draft