I started the day off on pg 403 of the Head First HTML and CSS book and ended on pg 498. That means I've got only about 200 pages to go! I learned that the reader can override our style by inserting !important after the value, but before the semicolon (with a space between the value and the !important). I learned that if block elements are placed on top of each other, their shared margin is the size of the larger of the two margins.
If one element is nested inside the other, and they both have margins, they can collapse. Whenever you have two vertical margins touching, they will collapse, even if one element is nested inside the other. Notice that if the outer element has a border, the margins never touch, so they won't collapse. But if you remove the border, they will.
A requirement for any floating element is that it have a width. All block elements have line breaks before and after them, so that means that even if I give a block element a width that is less than the width of the page/browser window, the block elements below it will NOT move up to the right of it, because of the line break. When an element is floated, block elements will fill in the space where the floated elements should be, BUT when the inline elements within those block elements are positioned, they respect the boundaries of the floated element, since they are floated around it.
So, a part of the block element is actually positioned under the floated element (because, by default, block elements have a width that spans the entire length of the page), but the inline elements within that block element will flow around the borders of the floated block element.
The "clear" property instructs an element to "clear" itself of any floating elements. You can use the clear property to clear the selected elements of any floated elements to the left, right, or both sides of the element.
If one element is nested inside the other, and they both have margins, they can collapse. Whenever you have two vertical margins touching, they will collapse, even if one element is nested inside the other. Notice that if the outer element has a border, the margins never touch, so they won't collapse. But if you remove the border, they will.
A requirement for any floating element is that it have a width. All block elements have line breaks before and after them, so that means that even if I give a block element a width that is less than the width of the page/browser window, the block elements below it will NOT move up to the right of it, because of the line break. When an element is floated, block elements will fill in the space where the floated elements should be, BUT when the inline elements within those block elements are positioned, they respect the boundaries of the floated element, since they are floated around it.
So, a part of the block element is actually positioned under the floated element (because, by default, block elements have a width that spans the entire length of the page), but the inline elements within that block element will flow around the borders of the floated block element.
The "clear" property instructs an element to "clear" itself of any floating elements. You can use the clear property to clear the selected elements of any floated elements to the left, right, or both sides of the element.
SUMMARY OF CODING SKILLS
Total Treehouse Points: 3,823
Treehouse Points by Subject Matter: HTML 663, CSS 1,599, Design 1,193, Development Tools 336, and Miscellaneous
Treehouse Ranking (%): "You have more total points than 86% of all students."
Treehouse Badge(s) Earned Today:
None
Treehouse Courses Completed:
How to Make a Website
HTML
CSS Foundations
CSS Layout Techniques
Aesthetic Foundations
Design Foundations
Adobe Photoshop Foundations
Adobe Illustrator Foundations (
Codecademy (& other) Courses Completed:
HTML and CSS (Codecademy)
Design Foundations
Adobe Photoshop Foundations
Adobe Illustrator Foundations (
Codecademy (& other) Courses Completed:
HTML and CSS (Codecademy)
Books Read or in Progress:
"Head First HTML and CSS," by E. Robson & E. Freeman (I've read the 37 pg. preface the first 255 pgs. (the HTML section), and am now up to pg 498 (now in the CSS section).
My Progress on The Odin Project:
1. Introduction to Web Development 100% Complete
2. Web Development 101 25% Complete
3. Ruby Programming 0% Complete
4. Ruby on Rails 0% Complete
5. HTML5 and CSS3 0% Complete
6. Javascript and JQuery 0% Complete
7. Getting Hired as a Web Developer 0% Complete
Hours Spent Coding Since the Last Post: 8
Total Hours Coding: 264
Total Hours Coding: 264
No comments:
Post a Comment