Tool to Convert External CSS to Inline CSS in Ruby? [closed] - css

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
I am messing around with GoogleDocs and it has very very primitive CSS support. If you upload an MSWord .doc or an HTML file and export it as HTML, all styles are applied inline. They have a style block in the html file, but when you upload the HTML file back to google docs, it doesn't apply any non-inline styles.
So I was thinking "maybe there's a ruby tool for this". Is there anything out there I could use to take some CSS and have it parse it into the HTML nodes, maybe some nokogiri plugin?

Check out alexdunae's Premailer on GitHub:
http://github.com/alexdunae/premailer
Never tried it by myself, just stumbled upon. Maybe it helps.

MailStyle is another solution: http://github.com/purify/mail_style
Looks like it has easy rails integration (actionmailer, sass), but I'm not sure that's what you are/were looking for.

Ruby Toolbox has a list of even more options. Premailer is the most used, though Roadie has been updated more recently.

Related

what is the reason to have <header> <footer> tags in html5 [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 5 years ago.
Improve this question
why to use tags in html5 even though we can achieve that functionality by html4 by adding css styles,
Other than every technology with latest version will have more flexibility or features. please help me to understand..
The main advantage is while loading your code the web browser knows the header and footer portion. It helps in prioritizing on the things to be loaded first and which has to be loaded later. In addition this will be much easily understood by a Google Bot or a screen reader due to its logical markup.
As #panther wrote, the main reason is semantics. Also it's better for search engines to use html5. You can achieve a lot of tags using some css, for example adding display: inline to div will give you span etc

Online tool to check/validate css [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 5 years ago.
Improve this question
Is this website code beautify reliable to check my css codes in details or are there other tools?
There are many websites like the one you've attached in your question and they usually follow the same rules, so I wouldn't be too worried about what you use. I use CSSLint from time to time, http://csslint.net/, which is very strict on the syntax and how you are using your rules.
The most important part of your CSS (in my opinion) should be, how reusable and maintainable your style sheets are, and there are many articles on the web which outline some of the principles you should be using, like https://speckyboy.com/good-bad-css-practices/, and a quick google for CSS practices will reveal many different guides and articles on this.
There are also IDEs with a form of intellisense on the CSS syntax, like WebStorm or Visual Studio Code (https://code.visualstudio.com/docs/languages/css), so you don't have to paste your styles to and from a website.

Any programs to generate css classes from your html? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
Just curious does anyone know a program or script to generate a style sheet(with blank values obviously) from the structure of your html document? Basically just pull out the ID's and Classes you set in your html and make placeholder css so you don't have to plan it ahead of time or write it again ,remember D.R.Y. anyone?:) Feel free to yell at me if you don't think this could help anyone else here :D . I'm sure I could whip something up like that but if it's already out there I might as well stick to my rule of DRABEE(Don't repeat any body else either) . Thanks.
Did you check http://primercss.com/ ?
Seems to be doing exactly what you are asking for.
CSS Frame Generator http://lab.xms.pl/css-generator/ works better than Primer.
Little late to the party but these days, there is also BearCSS:
http://www.bearcss.com/
Disclaimer
This answer is primarily meant to add extra value to this thread and create an overview of CSS generators.
In my opinion, after trying all the mentioned tools in this thread, http://lab.xms.pl/css-generator/ is the best one.
I found the best tools out there, after rigorous comparisons of the different available ones:
If you want to generate CSS automatically from the markup online for free, then you need BeeCSS - CSS Generator:
http://beecss.theextremewebdesigns.com/
If you already have (messy) CSS & you would like to clean/minify it online for free, then you need BeeCSS - Cleaner Minifier
http://beecss.theextremewebdesigns.com/css_clean_css_minify/

CSS editor recognize and index comments? [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 7 years ago.
Improve this question
A web page is usually consist of several areas, header, content, sidebar, footer, and can be more detailed, navigation, logo, slider, widgets...
I use comments to mark these areas in css file, as many others do. And used to scrolling or by search to locate the area while editing the css, it is slow and inconvenient especially when css file grows big.
Is there a css editor can recognize comments and produce an index table for quickly jump from one to another?
Netbeans has CSS selector jump support.
It indexes the CSS file you're working with and lets you choose which selector you want to jump to.
When you're editing HTML you can CTRL+click on the class or id to jump to the CSS rule that styles it (if there are several you get a list).
Here's an example:
Unfortunately, these Netbeans features will completely ignore your comments. I haven't come across a tool that does exactly what you're describing for CSS files.
If you were using a programming language you would probably use Javadoc-style comments, but these aren't typically used in CSS. You may be able to find a tool that will parse them and build an index anyway, but I'm afraid I can't suggest one.
Why not using separate css-files and then glue them in one file with ant? If you are using Eclipse - ant is already there. Or you can use ant as a command line tool.
Try it. You can perform other tasks with ant. For example you can minimize your .css or .js files as well.

CSS Documentation Template [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 5 years ago.
Improve this question
Does anyone know if there are CSS templates purely for documentation purposes? I haven't been able to find any.
Edit: Looks like I will have to write my own. Basically it would have been nice to have a little css template that has pre-styled notice boxes and lists purely for the use of user guides or documentation but not too hard to setup.
try 960 grid
it's basically a CSS framework
Blueprint CSS
On a par with 960 Grid
You may want to check out the designs at the CSS Zen Garden.
The goal of this site is to showcase what is possible with CSS-based design. Style sheets contributed by various graphic designers are used to change the visual presentation of a single HTML file, producing hundreds of different designs. The HTML markup itself never changes between the different designs.
On each design page, you'd have a link to view the CSS file of that design.

Resources