elements that don't have any content

putting one element inside another

specify these and other special characters using a simple abbreviation

< <

>>

&&

<a href="index.html#chai">See Chai Tea</a>

the @font-face rule

align all the inline content in a block element

the float property first takes an element and floats it as far left or right as it can

It then flows all the content below it around the element

you must specify a width

use the CSS clear property on an element to request that as the element is being flowed onto the page, no floating content is allowed on the left,right,or both sides of the element

it is removed from the flow and positioned accordign to any top,left,right,or bottom properties that are specified

Elements that are in the flow don't even wrap their inline content around an absolutely positioned element

place an element in a location that is relative to the browser window

fixed elements never move

the default value for positioning is "static"

the element is placed in the normal document flow and isn't positioned by you

takes an element and flows it on the page just like normal, but then offsets it before displaying it on the page

relatively positioned elements are first flowed into the page as normal, and then offset by the specified amount, leaving empty the space where they would normally sit

first, we added a <div> for the table with the id "tableContainer" This <div> contains the rows and columns. div#tableContainer { display: table;}

next,we added a <div> for the row, with the id "tableRow" if we had multiple rows, we'd need multiple <div>s div#tableRow { display: table-row;}

finally, we used our existing "main" and "sidebar" <div>s for the cells corresponding to each column in the row #main, #sidebar { display: table-cell;}