Q: I have a hard time remembering all of the names for things.
A: Jizelle - I have that problem too. There is a nice resource at the top of the course that has a bunch of elements and tags listed out for you. It can be really handy.
Q: I'm having a hard time remembering CLASS and ID tags.
A: Rachel - With the class/ID tags, I remember that class can be used multiple times within the same XHTML because there is more than one class in a school. With ID, there's only one person with your identification, so there can only be one of the same ID in an XHTML. I remember the # and . the same way -- when you're writing/typing, you only include one # at once, but you're able to add multiple.
W3schools reference: http://www.w3schools.com/css/css_id_class.asp
Q: I am having a lot of trouble with the box model assignments.
A: Rachel - Okay so, the box model is basically a way to better keep your website organized. Think of it like a bunch of boxes inside one another -- the biggest box is the margin. All of the other boxes (elements) go inside of it. So the margin is the largest box, it's the largest element on the website. It goes around everything else. It's like the space between the edge of the screen and then the content of the website. It's transparent. The next box would be the borders. You know what a border is -- these will use the background color unless you specify another one. The next box would be the padding -- this makes a space between the content and the border. Without it, the text would be squished right up onto the border. The next and smallest box is the content -- all the text and images and everything. The pixels and percentages and everything is how to make sure you size it right -- it's just simple math. When you're writing the code, you add in the height and width to the borders, padding, and everything right? So what you do is you add all of those together. To get the width you add all of the widths together -- the right border, left border, right padding, left padding, right margin and left margin. That's the total width. So for example...
div {margin: 20px; padding: 50px; border: 10px solid black;}The total width would be 160
You do the same thing to get the total height of an element, you just add the top border, bottom border, top padding, bottom padding, top margin and bottom margin. I hope that makes more sense!
A: Mitchel - I used to have a hard time with this as well, so what I do now is remember that it is the #ID of the .class
If this was confusing sorry it sounded better in my head before I wrote it down, but it still works. Thank you.
W3schools reference: http://www.w3schools.com/css/css_boxmodel.asp
Q: I struggle most with how all of CSS works and how it can apply to every page (index, product, home, events). How does that work?
A: Samuel - A single CSS file will work for all of your pages, as long as you link it in the header. Anything you change on the CSS file will affect every page (index, product, etc.) that has the link at the top. The code will look like this: <link rel="stylesheet" type="text/css" href="screen.css">
W3schools reference: http://www.w3schools.com/css/css_howto.asp
Q: I am having trouble with CSS float.
A: Rachel - Okay so floating is basically a better and easier to way to make websites look better. It positions an element to the left or right, relative to other block-level elements. If you wanted to make a two column page, you would have to make sure that the total width of both elements you want floating next to each other is 100% or less. You can figure that out by using the box model.
W3schools reference: http://www.w3schools.com/css/css_float.asp