Tag Archives: CSS

Comparing and contrasting Bulma and Bootstrap

I haven’t been shy in the past about how I have really prefer Bulma over Bootstrap.  I wanted to use this week’s post to compare and contrast the two and hopefully reset my opinion of Bootstrap.  So, how am I going to do that?  I am going to create a webform using Bulma and then tried to replicate it in Bootstrap. Continue reading Comparing and contrasting Bulma and Bootstrap

Three ways to create a modal dialog

Today, we are going to look at three ways to add a modal dialog to your app.  The first option just uses CSS and JavaScript (no special libraries).  The second option uses Bootstrap (a topic that I haven’t touched in a few years).  The third and final option uses Bulma.  I looked back at my previous posts and don’t think that I have covered this, yet.  I am purposely trying to keep the three examples as similar to each other as possible.  There is a button that opens the modal and you can close it by either clicking on the space outside of the modal or on the X in the corner of it.

Continue reading Three ways to create a modal dialog

CSS Image Carousel, Part 2

Recently, I was talking about how a random tweet got me thinking about CSS image carousels and at the end of that post, I mentioned that the second version of the image carousel would allow you to link to individual slides.  I figured that it was time to show how to do that.

See the Pen
Simple CSS-Only Image Carousel – 2
by Joe Steinbring (@steinbring)
on CodePen.

The above pen is just like the one from last week, except an unordered list, a little CSS to turn it into a menu bar, and some links.

Have any questions, comments, etc?  Feel free to drop a comment, below.

 

[ Cover photo by insung yoon on Unsplash ]

Two ways to make a pure CSS image carousel

Recently, I was doom-scrolling twitter when I came across a tweet that claimed that you can build an image carousel using just two lines of CSS.  I liked the tweet and then thought to myself “I can’t sleep, right now.  Why not try it out?”

It turned out that I needed a few more than two lines of CSS, but it was still somewhat simple. Continue reading Two ways to make a pure CSS image carousel