Browse the archive
Category: odin project
The CSS Box Model: Block And Inline/Divs and Spans
The MDN box model article linked in the previous lesson mentions that different display types have subtly different box models. It also mentions that…
Post Jan 9, 20239. The Box Model
Now that you understand the basic syntax of HTML and CSS, we’re going to get serious. The most important skills you need to master…
Post Jan 9, 202313. Flexbox: Axes
Let’s see how the orientation of items within a flex container can be controlled using the flex-direction property. Lesson Overview This section contains a general overview…
Post Jan 9, 20231. Introduction To HTML And CSS
So here it is: it’s time to actually start making things. This section will teach you the basics of HTML and CSS, the two foundational…
Post Jan 9, 20232. Elements And Tags
HTML (HyperText Markup Language) defines the structure and content of webpages. We use HTML elements to create all of the paragraphs, headings, lists, images,…
Post Jan 9, 20233. HTML Boilerplate
All HTML documents have the same basic structure or boilerplate that needs to be in place before anything useful can be done. In this…
Post Jan 9, 20234. Working With Text
Most content on the web is text-based, so you will find yourself needing to work with HTML text elements quite a bit. In this…
Post Jan 9, 20235. Lists
Whether it be IMDB’s top 250 movies or the FBI’s most wanted, lists are everywhere on the web and you are going to need…
Post Jan 9, 20236. Links And Images
Links are one of the key features of HTML. They allow us to link to other HTML pages on the web. In fact, this…
Post Jan 9, 20237. CSS Foundations
In the previous lesson, you learned how to write the HTML that determines how a web page is structured. The next step is to…
Post Jan 9, 20238. Inspecting HTML And CSS
Being able to inspect and debug your HTML and CSS is critical to frontend development. This lesson will take us through the Chrome Dev…
Post Jan 9, 202310. Block And Inline
The MDN box model article linked in the previous lesson mentions that different display types have subtly different box models. It also mentions that…
Post Jan 9, 202311. Introduction To Flexbox
Introduction As you’ll learn, there are many ways to move elements around on a web page. New methods have been developed over the years and older…
Post Jan 9, 202312. Flexbox: Growing And Shrinking
Growing And Shrinking Let’s look a little closer at what actually happened when you put flex: 1 on those flex items in the last lesson. Lesson…
Post