I posted a bit back about ripping a site and the best answer was using a website ripper or wget.

Is it possible to somehow rip a page and take all the styles with it in a usable way?

This might be hard to explain.

There's a few sites I like the design off and want to COPY :O but when I rip or check the code the stylesheets are all over the place and it's difficult to pull them together and find the bits that I need.

Is there anything out there that can flatten a webpage and get hold of only the styles that are used for that page? And roll them up nicely?

If I need to explain more I'll try my best.

developer tools plugin/firebug

Sorry, I thought you meant the moon on a /pr/ick! :(

(giggle)

The problem there is that a lot of websites will use minified stylesheets, or a stylesheet generated during deployment that is a combination of several smaller ones (particularly if they use SASS or LESS). That makes the resultant CSS file not particularly friendly to human readers, and somewhat difficult to pick apart.

Furthermore, a lot of designs are going to be dependent on a specific HTML structure, so even ripping the entire CSS file won't work when you apply it to your site.

You'd be better off using Chrome's Web Inspector, or Firebug, or Opera Dragonfly, and looking at how the site has achieved a particular effect/result. The Chrome WI Computed Style thing is pretty handy for this, and the Styles bit below that will list all the rules that apply to the selected element (with overridden ones crossed out).

I'll give that idea a go.

I'm not so much wanting to apply their styles to my site, more a case of doing it the other way round and taking their design and layout and making changes to that. 

I basically want to be able to take a page and make a template of some sort out of it.

Managed to strip it back and get pretty much what I want out of the page.

Next question, the CSS file has all the styles on a single line with no line breaks (fail)

Is there any software or site that will auto-format a CSS file?

Google it first.... http://www.cleancss.com/

search & replace with regular expressions

Chrome's Sources tab in the Web Inspector has a { } button at the bottom that formats source files nicely - works for JS, CSS and HTML.