Take the 2-minute tour ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.

So I've started developing web sites and have learned HTML and CSS fundamentals. However, I often run in to WTF-moments concerning layout; what looks good in one browser may look strange in another and I can't figure out why. Do I need to learn CSS beyond the fundamentals or are there any frameworks that can make life simpler for me?

share|improve this question

closed as not constructive by Martijn Pieters, Robert Harvey, World Engineer, Dynamic, MichaelT Feb 26 '13 at 4:45

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.If this question can be reworded to fit the rules in the help center, please edit the question.

4 Answers 4

up vote 1 down vote accepted

Seems like there are two questions here. So, to answer the first:

1) I've used Twitter Bootstrap on a handful of projects, and I can say that the grid system is really useful for getting a view laid out the way you need it. I'm also a fan of the JavaScript components it includes.

2) I've looked into Foundation, which also seems promising, but I haven't actually used it yet, so I can't speak to whether it's any better.

3) Every framework I've looked at includes hacks to make them look fairly consistent across browsers (back to IE7, at least).

As for the second question: yes, you do need to learn more than just the basics of CSS, as these frameworks are really just meant to get you started - you build off of them, and you need to be able to work around their idiosyncrasies.

share|improve this answer
1  
Twitter Bootstrap is great. I also really like OOCSS, which can be combined with Bootstrap. Nicole Sullivan's OOCSS framework has one of the more flexible grid systems out there that doesn't restrict you to any number of columns - it just uses size1of2, size1of3, etc. More important than the framework though is how Nicole has articulted the philosophy, which is really more what OOCSS is than her framework. Links: webdirections.org/blog/object-oriented-css-the-video github.com/stubbornella/oocss –  Matt Browne Feb 26 '13 at 1:49
1  
It's worth noting the last version of Foundation isn't compatible with IE7. It starts at IE8. –  Niphra Feb 26 '13 at 10:21
    
@Niphra Yeah, it looks like you'd have to use version 2.2 to get IE7 support (github.com/zurb/foundation/tree/2-2-stable) - I'll have to see what one loses by using the older version. Thanks for the input. –  Tieson T. Feb 26 '13 at 19:09

There are. I use Twitter Bootstrap to style my HTML5 single page application. Bootstrap also features some extra JavaScript animation. While I use most styles as they are, I additionally changed some stuff. It's very flexible.

share|improve this answer
    
Love bootstrap +1 –  jmo21 Feb 25 '13 at 21:36

Frameworks will only help somewhat, because someone else has done the work for you (which, isn't necessarily a bad thing.) However, when some idiosyncracy pops up, it really helps to be knowledgeable about CSS so you can go and solve it.

One thing to remember is that, at least as of CSS3, the browser problem has been explored; you're not alone in dealing with cross-browser compatibility! If you've been reading a lot of CSS lately, chances are good you've seen some property definitions like the following:

border-radius: 0.25em;
-moz-border-radius: 0.25em;
-web-border-radius: 0.2em;
-ms-border-radius: 0.25em;

Those funny -xxx- prefixes refer to some underlying browser technology like WebKit (Chrome, Safari), Microsoft (IE), and Mozilla (Firefox.) You can use those in a class to specify a browser-platform-specific behavior.

share|improve this answer

I would suggest twitter Bootstrapelse if you are using jquery UI . There also you can apply it with many themes . But using twitter Bootstrap use can design a very good professional interface with less efforts .

check this link: http://twitter.github.com/bootstrap/

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.