Tag: CSS

Prettier underline on text links

Funny post about Comic Sans’ing pointless or snarky comments over on CSS tricks. It’s a very amusing idea. However, when looking at the originating article “SNARKY COMMENTS IN COMIC SANS” I noticed their lovely text links. Chrome inspector to hand,… Continue Reading →

CSS animations and performance

Very few CSS animations are cheap in performance terms. Anything that causes the layout process (AKA reflow in Gecko browsers) is bad. The more complex your page the worse the performance hit. But – these four are apparently particularly cheap… Continue Reading →

Patternify (for repeating patterns not repeating paternity)

‘Cos I forget where I find these things – and as far as Base64 pattern generators go this one’s a doozy. An old doozy, but a doozy, nevertheless.

Fix overflow:hidden on div with display:table …

…one work-around is to add an extra containing div and set overflow:hidden on that. (Found when using display:table and display:table-cell; to vertically centre content of unknown height.)

Box model headaches a thing of the past?

There ain’t no fool like an old-school-fool.

Prevent line breaks on a forward slash

Need to prevent “£/$/€1,000,000!!!” or similar breaking over two lines at the forward slashes? CSS word-break, word-wrap, white-space not working for you?

CSS in PHP

The last time I tried to render CSS through PHP was many, many moons ago. I didn’t work and I couldn’t figure it out. Yesterday I tried again and found out why… the MIME type must be set as text/css…. Continue Reading →

Weird line-height in Chrome?

Specifying line-height on an <a> in a <li> will not work in your webkit based browsers. Line-height needs to be set on the containing <li> to work at all in Chrome or consistently in Firefox. Now you know.

The CSS reset has been reset

The grandaddy of all CSS resets hits version 2.o beta: Eric Meyer’s Reset Revisited. See also the subsequent thoughts on how to handle :focus. Update! Now at Beta 2.

On CSS image replacement techniques and SEO

Having learnt that properly structuring headings is very important to SEO but wishing to be able to style and design pages beyond the limitations of HTML text I’ve often reverted to this old CSS hack to replace heading text with… Continue Reading →

JavaScript Rounded Corners

Rounded corners with CSS and graphics is OK – but a pain to set up – requiring custom images and plenty of extra markup. JavaScript – particularly when helped by jQuery comes to the rescue and makes it fairly trivial…. Continue Reading →

Free from the shackles of CSS conditional comments

CSS hacks are here to stay but lets bundle them up in a single style-sheet… After trying to “hide my shame” [was it Zeldman that turned me on to CondComs with this phrase?] by using conditional comments for IE specific… Continue Reading →

Keeping your sites optimised

The sites I’ve been working on had been suffering from flab. A JavaScript library here (jQuery of course), a plug-in there, another, another, another… then a large plug-in that loads it’s own plug-ins (Shadowbox v3 – I’m talking to you)…. Continue Reading →

More PNG transparency notes

Via thinkvitamin and  tipster: a couple of notes that may resolve a couple of outstanding issues I’ve had with PNG24 transparency use… Set width and height for the element/s containing the transparent background image […] (also, bear in mind that the… Continue Reading →

IE6 link bug over PNG

One day I awoke brightly, but to my surprise… I’ve been so excited to be able to use full alpha transparency PNGs and getting them to play nice in IE6. Today I’ve found another PNG/IE6 issue. It seems that in… Continue Reading →

Disappearing fixed div in IE7

Who’d have thought – eh? Here’s a bug I came across while working on the updated Solutions Overseas website. Not used position:fixed; in anger before. The “Enquire Now” button there is fixed. Except in IE7 though. Looked around and it’s… Continue Reading →

© 2007-2019 qreativbox/Gabriel de Kadt — Powered by WordPress

Qreativbox Hack of BaskervilleUp ↑