block - Blog of Krasimir Tsonev

Simple, good looking separator made with pure CSS

posted in CSS3 on 2014-02-12 jsbin translate 95px 12px transform translate 95px line small link top solid 1px border top solid block border top display block border content display block

I'm currently working on the official site of AbsurdJS. There are a lot of code samples out there and I wanted to present them in JSBins.

SASS: @content directive is a wonderful thing

posted in CSS3 on 2013-08-06 button font size 20px color mixin content border font size 30px 20px text decoration size 20px text block font size display block font

I just started using SASS and I love it. A bunch of cool features, which will help me to improve my CSS coding. @content directive is one of them.

CSS: :before and :after pseudo elements in practice

posted in CSS3 on 2013-07-26 content css block text font element width code links height

By definition :before and :after are CSS pseudo elements. You can use them to insert something before or after the content of an element. There are some great articles giving the basics, but I wanted to write down a blog post for the real use cases. Or, at least, to show what I'm using them for.

CSS: using float property

posted in CSS3 on 2013-04-08 check pen clear float property element floating elements block floated result problem

float property is one of those CSS rules which are somehow difficult to understand. Before a couple of days I had a problem with floating divs. I solved it and decided to write an article about the solution. The article also covers some basics about floating.

Why we should think about our CSS

posted in Architecture on 2012-06-05 css browsers block rendering tv device ratio print tv device g print tv e g print browsers download css page browsers download white page browsers experience white page

_The evil that CSS do:- Browsers block rendering until all CSS arrives. With the worst possible experience: white page.- Browsers download CSS they don't need, e.g. print, tv, device-ratio... And most browsers block rendering because of these too- Sometimes CSS blocks the other downloads too (not just block rendering, but block images and scripts that follow) - when followed by an inline SCRIPT or when it's a CSS in conditional comment for IE_Read the full artcile by Stoyan Stefanov here.