Learning CSS

Abronsyth · #1 09-19-2011, 06:11 PM

Hey guys, I've recently started to learn CSS, and I finally have come up with something I'm moderatly proud of, seen here:
Archurub

I'd just like some feed back and such :)

Thanks,
Iris

Nemesis · #2 09-19-2011, 09:04 PM

looking really good! I am doing the same thing, in fact I have a 10 page website due in 10 days

Though you lose some points for not having this at the top of your document.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

Abronsyth · #3 09-20-2011, 11:45 AM

Wow, well, I'm certainly not taking a class on it! Just trying to learn how on my own...hehe, good luck with your 10 pages :)

Haha, I just got to the chapter about that on w3schools... And yes, I am learning from http://www.w3schools.com I find it to be excellent for teaching CSS to beginners like me :)

***ChibiMaestro*** · #4 09-20-2011, 01:33 PM

Woah,

in your CSS file, you have HTML D: NOOOO D:
CSS does not contain HTML at all, remove plz.

What Nemesis meant was to have that in the HTML template itself, not the CSS file.

I like the art and blue+grey combo though 8D
But, I think the login panel at the bottom is a bit too... stripey, and distracting.

You've got a good CSS start, I'm pretty sure you're way better than when I was starting CSS (which was like 1 and a bit years ago lolol).

If you need any help, feel free to ask!

***Inf3rnal*** · #5 09-20-2011, 03:59 PM

Quote:

Originally Posted by Nemesis

looking really good! I am doing the same thing, in fact I have a 10 page website due in 10 days

Though you lose some points for not having this at the top of your document.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

You don't need that horribly ugly doctype declaration. Html5's doctype is 100% supported in all browsers even in quirks mode.

Use:
<!doctype html>

Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<link rel="stylesheet" href="style.css">
</head>
<body>
</body>
</html>

Abronsyth · #6 09-20-2011, 05:18 PM

Yay, now I'm all confused :D Thanks people who know way more than I do about CSS...XD Well...it's not like anyone can actually see the coding of the CSS...grr...I'll edit it...I'm trying to fix the annoying striping problem...just need to figure out what to edit...

***Inf3rnal*** · #7 09-20-2011, 09:08 PM

Lets see.

CSS Files do not have headers. So it just looks like this:

id { stuffhere }
id2 { stuffhere }
id3 { stuffhere }

or the way I format

id {

stuffhere

}
id2 {

stuffhere

}
id3 {

stuffhere

}

HTML Files have tags such as <!doctype html>, <head>, <body>, <div>, etc.

Tags do not belong in .css files.

Abronsyth · #8 09-21-2011, 03:55 PM

Okay, I took all of the HTML tags out of the CSS document :D

I have it set in my mind how I want the finished site to look...now I just need to learn how to make it so...

[banner]
-space-
[navigation bar]
-space-
[content]
-space-
[footer]

With it all a set width, so you can see the BG image, and the content, footer, navi bar, and banner are all a set size instead of being the whole page...and having the amount of bits the user has shown some where...guh...I'll figure it all out eventually...

***Inf3rnal*** · #9 09-22-2011, 08:15 AM

You still have this in your style.css:

Quote:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
<head>
<style type="text/css">

Remove that and your golden.

Abronsyth · #10 09-22-2011, 03:38 PM

Well, here's the new version of the site with the experimental CSS...now, could someone who's more CSS savy than me please explain how to make it so the content (the white) stretches according to the text and such, as you can see in this screen shot, it's not working. Also, how would I move the whole thing into the center, so it's not all up in the left corner of the screen, and I'm trying to move the side bar over to the left, while still inside the content, and not disrupting the text and such in the content...anyone know how to fix that?

And, finally, does anyone know how to create a drop-down menu?

http://archurub.com

Screen Shot

What's New?

What's Hot?

What's Popular?