Homework Help

Juliasmama

Junior Member
Oct 19, 2005
14
0
0
Hi,
My dad told me to come here because I'm having problems with my homework. His username is Squisher. My assignment is about Cascading Style Sheets and I"m basically a beginner at this. I"m really confused as to whether I?m doing this correctly and I don?t even understand some of the steps. Here are the steps I?m supposed to be doing.

"-Set the margin and padding of the page body to 0 pixels. Set the page background color to white and the default font face to sans serif.
-Remove underlining from all links.
-For an element with the id "head" set the bottom margin to 0 pixels, set the background color to the value (53,43,48) and horizontally center the element?s content.
-For an element with the id, ?holelist? set the margin to 0 pixels, the padding to 1 pixel, the background color value (53, 43, 48) and horizontally center the element?s content.
-For links within the #holelist selector, enter the following styles: set the font size to 1.25em, the font weight to bold, the font color to white, and the padding to 0 pixels above and below the links and 5 pixels to the left and right.
-When users hover over links with the #holelist selector, change the background color to yellow and the font color to black.
-For an element with the id, ?holestats?, set the width to 120 pixels, the right margin to 10 pixels, the padding to 10 pixels except for the bottom padding which you should set to 25 pixels, the background color to the value (53,43,48) the font color to white, the font size to 0.7em. Float the element on the left margin.
-Display text marked with the strong element within the #holestats selector in yellow with a normal font weight."

Here are the next steps. This is where I got really confused.

"-For inline images with the #holesummary selector, apply the following styles: set the left and right margins to 10 pixels, and float the image on the left margin.
-For span elements within the #holesummary selector, apply the following styles: float the element on the left margin, set the padding on the right to 2 pixels, the font color to green, the font size to 300% of normal, and the line height to 0.75. "

This is what I have so far (its not much...):
/* 10/13/05 */

body {background-color: white; padding: 0px; margin: 0px; font-family:sans-serif}

#links a:link {text-decoration: none}
#links a:visited {text-decoration: none}
#links a:hover {text-decoration: none}
#links a:active {text-decoration: none}

#head {margin-bottom: 0px; background-color: rgb(53,43,48); text-align: center}

#holelist {margin: 0px; padding: 1px; background-color: rgb(53,43,48); text-align: center}

#holelist a:link {font-size: 1.25em; font-weight: bold; font-color: white; padding: 0 5 0} 5
#holelist a:hover {color: black; background color: yellow}

#holestats {width: 120px; margin-right: 10px; padding: 10px padding-bottom: 25;
background-color: rgb(53,43,48); font-color: white; font-size: 0.7em; float: left}

#holestats strong {color: yellow; font-weight: normal}

#holesummary


If someone could help me, I would GREATLY appreciate it!!!

 

screw3d

Diamond Member
Nov 6, 2001
6,906
1
76
To select elements within an element, just append the element tag/id/class name after the parent element.

Say you have the following html:

<div id="foo">
<img ...>
</div>

To select img, you'll want to do:
div#foo img { ... }

If that didn't answer your question, you want to be more specific on which part of the sentence you did not understand :)
 

Juliasmama

Junior Member
Oct 19, 2005
14
0
0
I'm curious if what I did so far is correct and I'm confused with how to do the inline image step.
 

screw3d

Diamond Member
Nov 6, 2001
6,906
1
76
Originally posted by: Juliasmama
I'm curious if what I did so far is correct and I'm confused with how to do the inline image step.

If it looks right then it's right :p Images are inline by default.. you can make it block by using display: block;, and so are span tags. I don't think you need to worry about that.

btw you might want to format your CSS this way

#someid {
xxx: yyyy;
}

so that it's easier to read