HTML/CSS simple website

I'm getting into CSS/HTML by myself. I'm already familiar with many programming languages (C, Java, etc.), but I don't know much about web development, especially about good programming practices when it comes to CSS/HTML. Could you guys please give me some tips and point out what I did wrong? I did kind of a small portfolio just for practicing:

main.css

/main css/

html,body,h1,h2,h3,h4,p,div{
padding: 0;
margin: 0;
border: 0;
font: inherit;
font-size: 100%;
}

body{
background-color: #FFFFFF;
}

h1{
font-size:3em;
text-align: center;
font-weight: bold;
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
color: #FFFFFF;
padding: 20px 0 20px 0;

}

p{
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
color: #222222;
margin: 20px auto 20px auto;
text-align: justify;
max-width: 700px;
}

.horizontalblack{
background-color: #222222;
padding: 40px 0 40px 0;
max-height: 100px;
}

.header{
min-height: 150px;
text-align: center;
vertical-align: middle;
}

.header h1{
font-size: 4em;
color: #000000;
}

.menu {
min-height: 100px;
}

.menu h2{
font-size:1.4em;
font-weight: 400;
font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
}

.menu ul{
padding: 40px 0 40px 0;
max-width: 600px;
text-align: center;
margin: 0 auto 0 auto;
list-style-type: none;
}
.menu li{
display: inline-block;
padding: 0 5px 0 5px;
}
.menu li:first-child{

padding: 0 5px 0 0;
}
.menu li:last-child{

padding: 0 0 0 5px;
}


main.html

`








Manoel Ribeiro

• About

• Projects

• Articles

• Skills

• Contact

HTML

Validity

You can validate your HTML code here. It found these issues:

• head must contain a title

• you have one too many closing div tags

HTML5

As you are using HTML5, you should think about using the newly available structuring elements (section, nav, article, aside, header and footer), instead of using generic divs.

So for example:

• ` could be






• could be






• the various subsections could use , with each of them containing a




The definitions of article and section are still a little vague as I understand them, so your document could also look like this:

    
        [header]
    

    
        [menu]
    

    

        
            
                about
            

            
                [content]
            
        

        [...]

    

CSS

Validity

You can validate your CSS here. It found no formal issues with your CSS code at all. Congrats :)

Formatting

• sometimes, your spacing is off (eg font-size:3em; is missing a space).

• you have some newlines that don't make so much sense.

Misc

• padding: X Y X Y; could be simplified to padding: X Y;`

Style

I like the style of the website. It might be a bit too simplistic, but the general direction is good.

But if the screen of the user is too wide, the black bars that span all the way across the screen might be a bit heavy on the eye.

StackExchange Code Review Q#80035, answer score: 4