[dan carson]

Hi everyone, I've been a lurker for a while now (big surprise, I know). This is my first post, and I figured that all of you might be able to help me out with something I've been working on. I've done mostly print work and flash design in the recent past, but I am trying to expand my skillset into CSS and XHTML. I've come up with a layout for a webzine my roomate and I are going to launch, but I don't know exactly how I should go about building it. Using only my current knowledge of HTML, I was going to build the site with tables. After reading around these forums however, it seems as though that is blasphemy. How would I go about building this layout? Are tables the correct answer? Please help! The link is to a screenshot of the layout. I thank you very much in advance for any help you can give me.

http://www.ihurtnow.com/dan/webcomps/layout3.jpg

[Mr Fred]

has to be css, xhtml.
dtd=strict.

quite a simple design to css

[oli]

Welcome lurker , it doesnt 'have' to be but its good to get into good habits so go with the css layout.That design shouldnt be too hard and you can always get help here if you get stuck.

[cam]

I like the screenshot by the way, if you can get the same look with xhtml&css, you're onto a winner.

[smallbeer]

I need to get out more. and I hope I haven't over stepped the mark here.

http://www.lifeofsmallbeer.co.uk/tests/ihn

Tested on IE6, IE5.5, Firefox 0.8

1. Obviously the photo needs changing to yours.

2. The navigation is under the content in the markup so you'll need to add a 'skip to navigation' link to avoid any accessibility issues. You might be best having the navigation above the content in the actual brwoser window to avoid any usability issues but that's up to you.

3. Transparency is a bitch, especially when it's over a photo. I've used a png for the top rounded corner. If you're viewing the site in anything other than IE you should see the transparency, otherwise you won't. The bottom border is just a gif. You'll have to decide whether you use pngs or not. I think there's a way to make IE sit up and listen - have a search on alistapart.com.

Hope you learn something from it.

[Mr Fred]

you have well over stepped the mark.
unfortunately safari is playing with it.

[smallbeer]

Originally Posted by JapanMik

you have well over stepped the mark.

Lucky I wasn't asking you then.

[Mr Fred]

fo.,

[cam]

man, next site I start i'll post a picture of the design here first ..

[Brown]

Originally Posted by smallbeer

3. Transparency is a bitch, especially when it's over a photo. I've used a png for the top rounded corner. If you're viewing the site in anything other than IE you should see the transparency, otherwise you won't. The bottom border is just a gif. You'll have to decide whether you use pngs or not. I think there's a way to make IE sit up and listen - have a search on alistapart.com.

those monkeys over at microsoft have given us a filter to fix that: filter: alpha(opacity=70);

use a pgn with alpha transparency as the bkg for the navigation and assign the filter above to the whole nav. should fix it.

sb - i don't see no transparency in any browser.

?

[Brown]

#navigation {
filter: alpha(opacity=70);
}

add that to sb's css

[Alex]

I just got a new big client, and could do with this chopping up......

go awwwwwwwn smallbeer

[lucidcreations]

Nice one smallbeer, I think you can get that trans png thing to work in IE with a bit of jiggery pokery

[Stickman]

The bottom corner isn't transparent here (firefox pc).

[Brown]

hang on, i missed the point. wrong transparency. that'd make the nav slightly transparent and allow the image to show through it slighty. which was not in the design but i think you should add it anyway.

[smallbeer]

Yeah brown I was talking about the rounded corners not the nav bar. I didn't even notice the slight transparency in that.

I left the bottom corner as a gif to show the difference to Dan.

Alex - go suck a fuck

[Alex]

Sucking a fuck was so last year

[smallbeer]

Sucking a fuck was so last year

It can be brought back for special occasions.

Have you seen your kustard site btw - obviously you have but things don't look right.

[Alex]

i dont get ya? Is something borking up?

[smallbeer]

Originally Posted by BoGeYMaN

i dont get ya? Is something borking up?

that's weird. I kept going to a page saying cpanel was b0rked and to contact an administrator.

Oh well, glitch in the matrix I guess.