ThemeShaper Forums » Thematic

[closed]

Using the 1140 grid ?

(13 posts)
  • Started 3 years ago by kflyer
  • Latest reply from helgatheviking
  • This topic is not resolved
  1. kflyer
    Member

    I've been trying out the 1140px Grid by Andy (http://cssgrid.net/) and it works amazingly great on handhelds. Never seen a better mobile version. How about it if we try to use this grid or its techniques to make Thematic more responsible ? Btw, I am eagerly awaiting to see some new themes for Thematic. Anyone coding something at present ? No matter how much I try using some other theme, nothing beats Thematic in its flexibility.

    Posted 3 years ago #
  2. there's a whole thread on this somewhere. but b/c of that thread i've started taking stabs at adapting adaptive css frameworks onto thematic.

    https://github.com/helgatheviking/Thematic-Adaptive

    check it out and maybe you could help me work on it. personally, i am not a fan of the fluid grid, and definitely think 1140 is too wide for comfortable reading (2 columns atleast). but well... i want to explore several and see if we can't come up with some good options for thematic's future. i think the code is a little lighter though.

    Posted 3 years ago #
  3. kflyer
    Member

    Thanks for the fast response Kathy. I'm not an expert on theming but I'm a theme enthusiast. Is there the possibility of creating a child theme with a fluid grid ? The 1140px grid can be adapted to two or three or even single column I believe.

    Posted 3 years ago #
  4. I too am looking to utilize the 1140 css framework in my thematic child theme. I'm having a bit of trouble figuring out where to insert your 3 column fluid grid css. Do I simply replace the thematic 3 col css call that I make in my functions.php? This does not seem to work and I'm not sure what order each stylesheet should be called in (typography.css, images.css etc.)

    Has anyone else done this successfully?

    Posted 3 years ago #
  5. you have to paste the layout into style.css b/c media queries don't work via @import

    Posted 3 years ago #
  6. Thank you helgatheviking! It works beautifully now :) Would you suggest simply adding properties onto those css selectors already included in your markup as I continue styling?

    Posted 3 years ago #
  7. i don't understand your question. i usually try to leave the layout stuff in one section and then do any styling in another, but it is all up to you

    Posted 3 years ago #
  8. What I meant was - since I copy and pasted your 3-col-fluid.css into my Thematic child theme's style.css and it addresses several elements I planed on styling (body, #branding, .menu etc), would you normally add additional styles to those elements that were pasted in?

    Your response makes me wonder how you separate your styles from your layout. Do you do all of this in your style.css?

    Posted 3 years ago #
  9. like i said before you could do it any way you like. the way you're asking about is totally valid... and probably results in a slightly more compact file.

    when i say i keep them separate i mean that i have

    #reset
    #clearfix
    #typography
    #general styles
    #layout grid
    #header styles
    #content styles

    and so on. for me it is as if i pasted the contents of each of the @imports into 1 file. and to keep organized i leave them in their modular sections.

    Posted 3 years ago #
  10. like i said before you could do it any way you like. the way you're asking about is totally valid... and probably results in a slightly more compact file.

    when i say i keep them separate i mean that i have

    #reset
    #clearfix
    #typography
    #general styles
    #layout grid
    #header styles
    #content styles

    and so on. for me it is as if i pasted the contents of each of the @imports into 1 file. and to keep organized i leave them in their modular sections.

    Posted 3 years ago #
  11. Excellent, it's working great now. I'm only having a problem with two items floating to the right when I collapse down to the mobile version in a browser (#access and #secondary). Any ideas on how I could fix this up would really help me out heh.

    http://imsfilms.pfd-dev.com/

    Posted 3 years ago #
  12. in the mobile size you need to use float: none; you must have a float somewhere that is more specific, b/c i am fairly certain that i unfloated the widget areas in my 1140 stylesheet. looking at your site, your markup seems off... you have 2 #primary divs with the same ID.

    Posted 3 years ago #
  13. I have #secondary set to float right because if I don't it vanishes. Also, #access is floated right so that it is right of #branding. Is there a better way to set this up?

    I just changed the class of the first #primary div, which I inserted into my functions.php to retrieve post meta data, though it's not exactly the effect I was going for: http://forums.themeshaper.com/topic/display-entry-utility-in-primary-on-specific-page

    Posted 3 years ago #
  14. if you go to my github link above i have since put in a 3 column version of 1140. you may want to look at that.

    Posted 3 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.