Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie

Responsive CSS problem

  • 05-05-2013 11:23pm
    #1
    off.the.walls
    Registered Users, Registered Users 2 Posts: 1,298 ✭✭✭


    so I have the css set up via the fluid layout that Dreamweaver cs6 provides.

    But I have two blocks of text that display side by side

    www.wmdmedia.ie/index.html

    the recent projects and about us section,

    so with the mobile version I want the recent projects to display across with the about displaying under it,

    however anytime I try move something with the mobile css it affects tablet layout and desktop layout.

    Anyone able to help?


Comments

  • #2
    28064212
    Registered Users, Registered Users 2 Posts: 10,785 ✭✭✭✭28064212


    Where are you making the changes? responsive.css or main.css?

    Boardsie Enhancement Suite - a browser extension to make using Boards on desktop a better experience (includes full-width display, keyboard shortcuts, dark mode, and more). Now available through your browser's extension store.

    Firefox: https://addons.mozilla.org/addon/boardsie-enhancement-suite/

    Chrome/Edge/Opera: https://chromewebstore.google.com/detail/boardsie-enhancement-suit/bbgnmnfagihoohjkofdnofcfmkpdmmce



  • #3
    smash
    Closed Accounts Posts: 34,809 ✭✭✭✭smash


    responsive.css seems kind of redundant as there's no media queries


  • #4
    off.the.walls
    Registered Users, Registered Users 2 Posts: 1,298 ✭✭✭off.the.walls


    responsive.css is just a row and column template i use to make the sizes %based instead of px based. i've made the changes in main.css


  • #5
    Kenny Logins
    Registered Users, Registered Users 2 Posts: 9,060 ✭✭✭Kenny Logins


    Don't you want the divs width to be 100% when the browser under 768 pixels? And that 'onecol' divider needs to go.


  • #6
    28064212
    Registered Users, Registered Users 2 Posts: 10,785 ✭✭✭✭28064212


    off.the.walls wrote: »
    responsive.css is just a row and column template i use to make the sizes %based instead of px based. i've made the changes in main.css
    So what changes have you made to main.css under mobile layout? It's empty at the moment, is this on your local/test copy? As it says in main.css, the desktop section "inherits" styles from tablet, which inherits styles from mobile, so any changes to mobile are supposed to affect the others. You're supposed to overwrite them in the tablet and desktop sections

    Boardsie Enhancement Suite - a browser extension to make using Boards on desktop a better experience (includes full-width display, keyboard shortcuts, dark mode, and more). Now available through your browser's extension store.

    Firefox: https://addons.mozilla.org/addon/boardsie-enhancement-suite/

    Chrome/Edge/Opera: https://chromewebstore.google.com/detail/boardsie-enhancement-suit/bbgnmnfagihoohjkofdnofcfmkpdmmce



  • Advertisement
  • #7
    off.the.walls
    Registered Users, Registered Users 2 Posts: 1,298 ✭✭✭off.the.walls


    28064212 wrote: »
    So what changes have you made to main.css under mobile layout? It's empty at the moment, is this on your local/test copy? As it says in main.css, the desktop section "inherits" styles from tablet, which inherits styles from mobile, so any changes to mobile are supposed to affect the others. You're supposed to overwrite them in the tablet and desktop sections

    So I should write it for mobile and then change it for tablet and for desktop?

    I appear to of been going about this all wrong! thanks guys


  • #8
    Kenny Logins
    Registered Users, Registered Users 2 Posts: 9,060 ✭✭✭Kenny Logins


    I would work the other way around - full size first, then carry required changes for each band down to 480px. I'd also keep these styles separate, in responsive.css.


  • #9
    KonFusion
    Registered Users, Registered Users 2 Posts: 2,588 ✭✭✭KonFusion


    Everything you need to know, right here.


Advertisement