***Assessment Test CSS - Tony Jenicek

Candidate assessment test CSS - Tony Jenicek

HTML

<div>
     <h1>CSS Questions</h1>
    <p> <span>show us your <span>CSS skillz!!!</span></span>
    </p>
    <ul>
        <li>List Item 1-1</li>
        <li><span>List Item 1-2</span>
        </li>
        <li><a href="#" title="i'm a link"> List Item 1-3</a>
        </li>
        <li>
            <ul>
                <li><span>List Item 1-4-1</span>
                </li>
                <li><a href="#" title="i'm a link"> List Item 1-4-2</a>
                </li>
                <li><a href="#" title="i'm a link"> List Item 1-4-3</a>
                </li>
            </ul>
        </li>
    </ul>
    <ul>
        <li>List Item 2-1</li>
        <li><span>List Item 2-2</span>
        </li>
        <li><a href="#" title="i'm a link"> List Item 2-3</a>
        </li>
        <li>
            <ul>
                <li><span>List Item 2-4-1</span>
                </li>
                <li><span>List Item 2-4-2</span>
                </li>
                <li><span>List Item 2-4-3</span>
                </li>
            </ul>
        </li>
        <li>List Item 2-5</li>
    </ul>
    <p id="move-me"> <span>
                a nice shot of manhatan.  
                change my position please
        </span>

        <img src="http://7-themes.com/data_images/out/61/6978857-manhattan-nyc-skyline.jpg" height='250' width='350' />
    </p>
    <p>fin!</p>
</div>

CSS

/* #1 */
div * {color:#8A4B08}

/* #2 */
div:first-child h1 + p {text-transform:uppercase}

/* #3 */
a:link, a.visited, a:hover, a:active {color:#ff0000}

/* #4 */
ul li ul a:link, ul li ul a.visited, ul li ul a:hover, ul li ul a:active {color:#0101DF}

/* #5 */
div:last-child ul + p {text-transform:uppercase}

/* #6 */
div > ul > li > a {font-weight:bold}

/* #7 */
#move-me {position:absolute;top:0px;right:0px}
#move-me span {float:right}
#move-me img {float:right}

JavaScript

/*
************************************************************
CSS Questions
***********************************************************
*/

/*
//#1:
    set font color for ALL <div> CHILD 
    ELEMENTS to #8A4B08
*/

/*
//#2:
     capitalize ALL TEXT within the 
     FIRST PARAGRAPH.
*/


/*
//#3:
     set font color FOR ALL LINKS 
     to #ff0000
*/

/*
//#4:
     set font color for DEEP NESTED links 
     (within nested UL) to #0101DF 
*/


/*
//#5:
    write an adjacent selector that sets makes 
    text UPPERCASE for the FIRST PARAGRAPH 
    after the LAST UL
*/


/*
//#6:
   select all direct child links for FIRST LEVEL ULs
   and make font bold
*/


/*
//#7:
   Find element with ID "move-me" and change it's 
   position to where it is affixed at TOP RIGHT
   withing the "result" box. Also make sure 
   text within "move-me" is always on top of 
   image.
*/


//THANKS!!!