Search results
Nick Basile (born February 10, 1978) is an American film director, producer, actor and screenwriter. Films produced and directed by Basile include The Adventures of Captain Steel , Slasher Flick (featured on the NYC Horror Film Festival DVD); the futuristic thriller Beyond Dreams and the award-winning thriller/modern-day western The Man Who ...
Hi, I'm Nick! I live in Houston, TX - where the sun is hot, and the tacos are plentiful. Since 2014 I've worked at a variety of companies, including my own, as a product designer and full-stack developer.
- The Set-Up
- Our Html
- Layouts with CSS Grid
- Styling with Tailwind CSS
- The Wrap-Up
We'll keep this project as small as we can, so we can focus on writing our CSS. First, we'll need an index.html file and a main.css file. We'll also need an img directory to store the images for our photo gallery. Inside of index.html, our boilerplate HTML can look like this: Pretty simple stuff. We have a basic HTML file that pulls in Tailwind via...
To start, we'll need a wrapper inside of our that can hold all of our grid elements. Then, inside of here, we can add our first grid element. As you can see, we're using an tag so we can link to where we found our image. Inside of our tag, let's add a title and the image itself. And voila, we have our HTML. Now, let's duplicate t...
When we look at our HTML's output on the screen, we can see that we've got a lot of work todo. While we have some lovely pictures, they're just stacked right on top of each other. This layout may work for our mobile site, but for desktop screens, we're going to need to have two rows and three columns for our six images - sounds like the perfect job...
Let's start by adding some color to our background, improving our typography, and increasing the whitespace. Right away the background color provides a better visual contrast between our elements, and the additional whitespace helps distinguish each of the cards. Now we can style our first card before applying the styles to the rest of them. Now we...
We sure learned a lot today. Building our layout with CSS Grid exposed us to some of its newer concepts like grid-template-columns, grid-gap, and repeat(). And, using Tailwind to style the rest of our page increased our familiarity and understanding of the framework. Plus, we even covered a few design concepts to boot! As always, feel free to ask m...
Nick Basile Product Designer, Developer, Maker. I craft experiences that help people reach their full potential.
I am Nick Basile. I love to design and build websites. I constantly strive to improve the design and features of the websites that I am involved with in order to enhance my users’ experience.
I'm Nick - I like building things on the web and teaching other people how to build their own things. I stream about building digital things. Along the way, I explain what I'm doing so you can do...
I am a multitalented producer and engineer, skilled in translating subject matter into engaging programs for a wide range of audiences.
- Monmouth University
