Recently I was uninspired by Bootstrap’s cop-out for responsive tables where they just add horizontal scrollbars for widths under 768px.
I’d come across a few ideas in the past and now I’m exploring them to give pros and cons for each solution.
Posted in: HTML, Responsive development, Usability, Web development
13 June 2014
A few links I found interesting this week.
13 May 2014
This would be useful on a calendar when selecting a range between two dates.
9 May 2014
I get a LOT of email from recruiters, this is a collection of the strangest:
Hedging their bets:
“We may or may not have spoken in the recent past.”
22 April 2014
This might be useful for a list of search results where you want the ability to show more images without the distraction of using a full carousel.
22 November 2013
The first in what I hope is a series of simple techniques to get around problems that at first sight might seem impossible. I like to say that everything is possible given a bit of thought*.
This technique is for when you need to place a background-image more than 100% to the right of the page.
24 October 2013
Having spent just over two years working as a front-end developer on Ruby on Rails projects I’ve become pretty handy with ERB, HAML & SASS but when it comes to looking further into the back-end stack I’ve been hesitant to do anything except look at the code and write the occasional simple helper for my views. I’ve had an idea for a while and I decided to bite the bullet and make it myself.
The site is I love your style. The idea is to be able to ask beauty or fashion questions directly to those people you admire, as an aside you can also ask the wider community. The grand vision is for it to be a Stack Overflow for beauty and fashion.
22 August 2013
For years designers have overlaid labels onto input fields in order to save screen real-estate. As front-end developers we implement this using absolute positioning and event handlers to move the label offscreen once the user has focused into the field. User focuses; label disappears.
The placeholder attribute was introduced in HTML5 and has since been misused in order to replicate the functionality described above. Let me set this out very clearly before we move on, the placeholder attribute IS NOT a replacement for a label.
16 August 2013
I was having a problem where adding a basic css opacity on an element wouldn’t work when viewing in iOS. Looked fine on desktop.
I didn’t come across a specific solution to my problem, but someone else had a similar thing when using opacity with transitions.
2 August 2013
Ever seen this when testing a website in IE8… Instead of the usual obfuscation using dots or stars, you see a square/rectangular symbol which usually shows up when the browser doesn’t have the entity available to display. The usual reason is that there is a custom font or webfont in use on the fields.
5 June 2013
It’s easy to make a perfect square in CSS – set an equal height and width and boom, you’re done. But what if you don’t always know the width of the square? For instance you’ve given the structures percentage widths to fit a fluid container.
No hacks, no javascript?
15 March 2013
I have a results table where each row is a form and the user continues by pressing the submit button for that result. At smaller widths I collapse the table, hide the submit button and add a click event handler to the tr – it works fine, up to a point.
A filter bar was added that uses AJAX to reorder and add to the results so now the DOM is being generated with JS. Usually you can use .on(event, selector, handler) to catch any generated elements, but this won’t work on iPhone or iPad*.
19 December 2012
I wanted to do a round-up of things I’ve written in 2012, but quite pathetically that would give me a list of three, so I’ll add to that what I’ve been working on this year.