Welcome to the ultimate resource for CSS help and tutorials. We have excellent, well thought out tutorials that can give you the tips and tricks to out design the rest. WordPress and Drupal are the main CMS we cover as well.
CSS3’s mix-blend-mode property is a handy tool for developers to use to create some cool effects without having to use image editing software like Photoshop. The mix-blend-mode property dictates how an element’s content should blend with the element’s background. For this tutorial, we’re going to use it to create a window text effect, like you see in the image above.
To start, you’ll need a div, and some text inside that div, like this:
The div should have a designated width and height, and a cool image for a background.… Continue Reading
CSS3’s text-shadow property makes it super easy to create some neon text. All you need to do to create the neon glow effect is to keep adding values to the text-shadow property, making sure that the horizontal and vertical shadow values remain at 0, while the blur radius values keep increasing. Check out the code below:
The text-shadow values with the smallest blur radius (5px and 10px) are the same color as the text to make the edges of the letters appear a little fuzzy — this enhances the neon glow effect we’re going for.… Continue Reading
Any given HTML element can have more than one class. Assigning multiple classes to a single HTML element looks like this:
The syntax is pretty straightforward. All of the classes need to go within the one set of quotation marks, and they all need to be separated by one space. The example above shows an HTML element with 3 classes, but there’s truly no limit to how many classes an HTML element can be assigned.
In some cases, an element will belong to multiple classes that have overlapping properties.… Continue Reading
CSS3 allows you to set the background of any HTML element to a gradient using the background or background-image property (background-color is used for solid colors only).
The syntax is fairly straightforward. If you want to create a gradient like the one above of two or more (your gradient can be comprised of as many colors as you’d like) shades, all you need is one line of CSS:
By default, the gradient is vertical, but you can easily change the gradient’s direction with CSS.… Continue Reading
By definition, footers are meant to be at the bottom of a web page. However, a footer’s default positioning typically dictates that the footer will appear directly below the main content of a page, and if a particular page doesn’t have a lot of HTML content, the content and, in turn, the footer may not reach the bottom of the screen.
See all that space underneath the footer? That last line of the page really belongs at the bottom of the browser window. The footer positioning can be fixed by playing around with the margins, but that’s an inconsistent solution at best. … Continue Reading
