Ep5i10n Posted May 8, 2012 Author Share Posted May 8, 2012 I'm working on a sort of "Blog" element for my website and what I have currently is Some HTML but no working CSS. I always have failed with css. So here is the html so you may see what it looks like.>! ```>! Post title Posted &date by poster Lorem ipsum dolor sit amet. [url]Link To this Post[/url] Tags>! ```And here is my fail at CSS so you may be able to see what I'm trying to do>! ```.blog {text-align centerfont-family: 'Oxygen', sans-serif;}.post{text-align centerfont-family: 'Oxygen', sans-serif;}.head{font-family: 'Oxygen', sans-serif;text-align centerfont-size large}span.head{font-family: 'Oxygen', sans-serif;font-size small}>! .foot{font-size small}>! ```From the fail CSS you may be able to see what I'm trying to do, any help on this would be appreciated Link to comment Share on other sites More sharing options...
Lenton Posted May 8, 2012 Share Posted May 8, 2012 **Here's a few pointers:**- You forgot your tag at the top. :3- For valid XHTML you need to use quotes with your attributes. For example: class=blog should be class="blog"- You should use an ID selector (#) when your only going to use it once on a page and a class selector (.) when you may use it more than once on a page. For example:should bebecause it will only be used once.- The syntax of your CSS is wrong, check out this [tutorial](http://www.w3schools.com/css/css_syntax.asp). For example: text-align center should be text-align: center;- When using the property "font-size" it's best not to use the value "large". Specify a pixel value like this: font-size: 16px;- In CSS there's something called inheritance which means the child object will inherit all of the parent objects properties. If we put the "font-family" deceleration in the body selector the "blog" div will inherit that font. This means that we only have to specify it once in our code.**I also tidied up your code and gave you a few example CSS declorations for you to play around with:**>! Post Title Posted 01/01/2012 by Bob Lorem ipsum dolor sit amet. [Link To this Post](#) Tags >! body {font-family: 'Oxygen', sans-serif;font-size: 12px;}#blog {background-color: grey;}.post {background-color: white;border: 5px solid yellow;}.post .title {font-size: 16px;font-weight: bold;}.post .info {color: grey;{.post .tags {color: green;} Link to comment Share on other sites More sharing options...
Ep5i10n Posted May 8, 2012 Author Share Posted May 8, 2012 > - You forgot your tag at the top. :3Thats never happened to me before :3Thanks man :cheesy:@Lenton:> **Here's a few pointers:**> > - For valid XHTML you need to use quotes with your attributes. For example: class=blog should be class="blog"> - You should use an ID selector (#) when your only going to use it once on a page and a class selector (.) when you may use it more than once on a page. For example:should bebecause it will only be used once.> - The syntax of your CSS is wrong, check out this [tutorial](http://www.w3schools.com/css/css_syntax.asp). For example: text-align center should be text-align: center;> - When using the property "font-size" it's best not to use the value "large". Specify a pixel value like this: font-size: 16px;> - In CSS there's something called inheritance which means the child object will inherit all of the parent objects properties. If we put the "font-family" deceleration in the body selector the "blog" div will inherit that font. This means that we only have to specify it once in our code.> > **I also tidied up your code and gave you a few example CSS declorations for you to play around with:**> > >! Post Title> Posted 01/01/2012 by Bob> > Lorem ipsum dolor sit amet.> > > [Link To this Post](#) Tags > > >! body {> font-family: 'Oxygen', sans-serif;> font-size: 12px;> }> #blog {> background-color: grey;> }> .post {> background-color: white;> border: 5px solid yellow;> }> .post .title {> font-size: 16px;> font-weight: bold;> }> .post .info {> color: grey;> {> .post .tags {> color: green;> } Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now