The following script resizes the width of HTML’s tag dynamically according to the width of the selected option. This may be used in places where you want to customize the select tag and make it look like a dropdown select. Demo Open demo in a full window –...
Here are some responsive web design icon you can use freely anywhere in your website and web designs. I extracted them from demo images containing lines and dotted backgrounds used by stock images websites. I used Photoshop to do it.
full calendar The FullCalendar Approach FullCalendar is great for displaying events, but it isn’t a complete solution for event content-management. Beyond dragging an event to a different time/day, you cannot change an event’s name or other associated...
divi screenshot.png file I created a very basic Divi child theme from the instruction provided from their official blog post – https://www.elegantthemes.com/blog/divi-resources/divi-child-theme. I am also using the Divi page builder and it has been quite a good...
For including high-res graphics, but only for screens that can make use of them. “Retina” being “2x”: Difference between normal display and retina display CSS – Media Query @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (...
The following code scale font-size from a minimum of 16px (at a 320px viewport) to a maximum of 22px (at a 1000px viewport). CSS html { font-size: 16px; } @media screen and (min-width: 320px) { html { font-size: calc(16px + 6 * ((100vw – 320px) / 680)); } }...
Here is a layout using CSS Grid. grid layout – css You can design a CSS Grid-based layout with the help of an intuitive graphical user interface and generate HTML and CSS. – https://tools.webdevpuneet.com/css-grid-layout-generator/ Demo Open demo in a full...