Use case comparison between CSS Grid and Flexbox

Responsive design is a must-have in web design right now. And that can be easily achieved using CSS Grid or Flexbox. The CSS Grid Layout Module offers a grid-based layout system, with rows and columns, making it easier to design web pages without having to use floats and positioning. The Flexible Box Layout Module, makes it easier to design flexible responsive layout structure without using float or positioning. In this article, we are going to look into the differences between CSS Grid and Flexbox. Are they a replacement for each other? Do they go hand in hand together? Can they

Be cautious with 'display: none' style

Most of the time, we use display: none property to hide the elements from out HTML page. Reference: http://www.w3schools.com/css/css_display_visibility.asp But this property might make you bang your head, if you are adding any event to the elements having this property. Yeah, recently we faced some strange issue in our ember-application. We have a image-upload feature in application. For that we have added a button "Add Image" and a file input. The file input we kept hidden and on click of the button "Add Image", we were triggering click

CSS and ActionMailer in Rails3.

Lately, I was working on a project where I found an issue that emails sent using ActionMailer were not applying css styles to the html elements of the email. On adding style tag in the email view files, I was able to view stylings on thunderbird mail and ymail but still I was unable to view css stylings for emails in gmail. On furthur investigating the issue, I found that gmail requires inline stylings to be applied to the email templates. I found some gems which could fix this problem by converting external css to inline css. I tried the