User:Terriethomas/Sandbox/HTML Lessons

Problem One
Why aren't there ending cell tags for some of the examples in this lesson? If they are not required why show them in the answer key?

Notice that the wikitext does not require a closing tag for the |- or the |  tags. When the browser sees a | tag, it knows that there is no more data to put in the previous cell and the new data is to be installed in the next cell. The only wikitext tags we have covered so far that require a closing tag are the table tags {| |}.  Charles' code doesn't work because the beginning quotation marks are backwards:

Problem Two
The code to the Answer to Problem Two has the border value as"double" instead of "solid" as indicated in the instructions.

Problem One
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Typi non habent claritatem insitam; est usus legentis in iis qui facit eorum claritatem. Investigationes demonstraverunt lectores legere me lius quod ii legunt saepius. Claritas est etiam processus dynamicus, qui sequitur mutationem consuetudium lectorum. Mirum est notare quam littera gothica, quam nunc putamus parum claram, anteposuerit litterarum formas humanitatis per seacula quarta decima et quinta decima. Eodem modo typi, qui nunc nobis videntur parum clari, fiant sollemnes in futurum.

Problem Two
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.

Testing

 * Here is an example with coding:

Here is the code for all three boxes. Notice the positioning attributes: <div style=  "background-color:#ffff00; width:50px; position:absolute; left:50px; top:70px"  &gt;

<div style=  "background-color:#008000; width:50px; position:absolute; left:80px; top:40px"  &gt;

<div style=  "background-color:#ffa500; width:50px; position:absolute; left:90px; top:80px"  &gt;

Z-Index

 * You can add the z-index attribute to change the order of appearance.
 * Since there are 3 boxes to deal with the first box is layer 1, the second box is layer 2, and the third box is layer 3.
 * If we want to put the first box on top of the others we use this code: z-index:3, which put the first box on layer 3.
 * The second box is now layer 1 and third box is layer 2 but first box is now layer 3.

Here is the coding for the first box which will make it appear on top: 