[Konnor]

Hi there,

I've knocked up a single page for a site I designed a while back. I used to dabble a little with photoshop but am fairly rusty, and am looking to get back into designing and coding sites. Thought it would be good to revisit this template and try to code it effectively.

I'm looking predominantly for CSS feeback.

mattoconnor.co.uk

Be as brutal as you like.

I did have a few of my own questions which cropped up.

• I've not used any classes, but checking my markup there is no repetition of div's. Does this look okay?
  
• How might I consider adding drop shadow to the entire outside? In order to get the gradient effect I've added and additional div with a repeating image, with a div inside that with a black background. Adding multiple other divs for a drop shadow seems like it could get messy?
  
• I've not used any positioning. The video tutorial I watched prior to coding this didn't seem to use any. Does it require it?
  
• The look is almost right but I'm struggling with my <h2> and <span> tags. I seem unable to specify 2 different font families for the different components. So I've wrapped the welcome in a <span>, made it 'Leto', uppercase and white by targeting it specifically. Then near the start of my CSS I have <h2> which I'm wanting to display as Arial. I don't think it's doing anything currently, and I thought it might inherit from the body tag.

Many thanks,

[nublue]

HI Matt,

I am struggling to find much fault with that!

The HTML is nicely marked up with commetns which is excellent practice. If I was being picky I could say that it fails validation with one error! But I wouldnt lose any sleep ov er that

The same goes for your CSS which is nicley laid out with comments. You have used a CSS reset which is again good practice.

With regard to your q's:

1) You don't need to use classes. You are right that they should be used for repetitive styles, but if you dont have any dont worry about it.

2) One image the repeats down the page behind the main content would do it. So you would have background. a layer on top of the background with the shadow and then website frame/content itself.

3)Not sure what you mean by this?

4)Get the web developer tool bar for firefox. and use it to outline element information. If you then click on your H2 it will show you the CSS that is controlling this element. This is a godd trick for troubleshooting any elements that look like they are inheriting styles as you mentioned.


I hope that helps.