Design Post Update

CSS positioning is a lot more advanced than just top, middle or bottom!CSS PositioningWith CSS positioning, you can place an element exactly where you want it on your page. Together with floats, positioning gives you many possibilities to create an advanced and precise layout. To help us understand imagine a browser window...

The basic principles of CSS floating are displayed in this simple diagramFloating elements with CSSAny HTML element or <div> block can be floated to the right or to left by using the property float. That is to say that the <div> block or element, including its contents, either floats to the right or to the...

CSS Padding, Borders and MarginMargin and Padding:Now let's look at how you can use your knowledge of the box model to change the presentation of elements by setting the margin and padding properties as shown in the above example.An element has four sides: right, left, top and bottom. The margin is the distance from...

The CSS Box ModelThe CSS Box ModelThe box model in CSS describes the boxes which are automatically generated for all HTML-elements and which you can control using CSS. The box model contains detailed options regarding adjusting margin, border, padding and content for each element. The diagram below shows how the box...

class and id work together with div and span to help you make the most of your CSSThis section on CSS actually focuses on the use of HTML attributes 'class' and 'id' and the HTML elements <div> and <span>. These are very important if you are to use CSS effectively as they hold the key to giving you complete...

CSS LInksYou can apply the CSS that you already learned to links in order to change their backgrounds, colours, fonts, text style, etc. What we will learn in this lesson is that CSS allows you to define these properties differently depending on whether the link is unvisited, visited, active, or whether the cursor is on...

There are so many fonts to choose from but choose carefully as they have a huge impact on your websites successFormatting Fonts With CSSIn this lesson you will learn about fonts and how they are applied using CSS. We will also look at how to work around the issue that specific fonts chosen for a website can only be seen...

This will be funny once you've learned about CSS Text and FontsFormatting Text With CSSFormatting and adding style to text is a key issue for any web designer. In this lesson you will be introduced to the amazing opportunities CSS gives you to add layout to text. The following properties will be explained:text-indenttext-aligntext-decorationletter-spacingtext-transformtext-indentThe...

You can use CSS to add any type of background to a web page or web elementIn this tutorial we will learn how to apply background colours to your website and parts of your website. We will also look at advanced methods to position and control background images. The following CSS properties will be explained, (note the American...

CSS is a style language that defines the layout of HTML documents. What is CSS?CSS is an acronym for Cascading Style Sheets. It is a style language that defines the layout of HTML documents. CSS covers fonts, colours, margins, lines, height, width, background images, positioning an d many other things. HTML is often...

Common device breakpointsAt this point you have probably already heard about responsive web design and how every website needs to compatible to work well and look good across multiple devices. If so, you heard right!With a @media query, you can write different CSS code for different screen sizes or for different devices,...