Tag Archives: float

Building a Simple Float Layout

Posted on March 30, 2022 by Ann

width: 1200px; (this is a good width for float, flexbox, or CSS grid) background-color: green; (when adjusting things, it is good practice to give elements a background color so you can more easily see it. You will then remove it … Continue reading →

Posted in Web Developer Course | Tagged , , , | Leave a comment

Clearing Floats

Posted on March 28, 2022 by Ann

Although, using floats is outdated, you might see this out there. So, when your height collapses in a float, there are two ways to fix it. Adding the following, will “clear up” and bring the height back (background color to … Continue reading →

Posted in Web Developer Course | Tagged , , , , | Leave a comment

Using Floats

Posted on March 25, 2022 by Ann

Let’s add a class=”author-img” to our HTML picture, and add the following to our CSS: .author-img { float: left; } This will act like an absolute positioning element. It will pull the .author-img out of the normal block (all by … Continue reading →

Posted in Web Developer Course | Tagged , , , , , | Leave a comment

The 3 Ways of Building Layouts

Posted on March 23, 2022 by Ann

LAYOUT Layout is the way text, images and other content is polace and arranged on a webpage. Layout gives the page a visual structure, into which we place our content. Building a layout: arranging page elements into a visual structure, … Continue reading →

Posted in Web Developer Course | Tagged , , , , | Leave a comment