CSS Trouble...

[vrufusx65v]

I have made a webpage in Photoshop and now im having issues converting it to CSS and XHTML with a little but a jquery, javascript, etc. I have been going to net.tuts+ for a while now and i still can't get my page to be flawless and filled with life like they can. Would anyone know of some good tutorials for basically creating a CSS/XHTML page from photoshop? [Preferably a video tutorial]

here's a pic of the site for review purposes...comments and criticism are happily notified...

[elion]

I have made a webpage in Photoshop and now im having issues converting it to CSS and XHTML with a little but a jquery, javascript, etc. I have been going to net.tuts+ for a while now and i still can't get my page to be flawless and filled with life like they can. Would anyone know of some good tutorials for basically creating a CSS/XHTML page from photoshop? [Preferably a video tutorial]

here's a pic of the site for review purposes...comments and criticism are happily notified...

it's too difficult.

[mattura]

go for a few css tutorials first, then you'll understand what you can do with a bit of style.
Looks pretty much possible to me, you must see your page as either a table or as floating <div>s
Look up css 'float' and try playing around with 'margin', 'padding', 'border' and 'background'

If this is too hard, you could perhaps do it in flash...it would look more slick and be easier to convert from photoshop.

[vrufusx65v]

go for a few css tutorials first, then you'll understand what you can do with a bit of style.
Looks pretty much possible to me, you must see your page as either a table or as floating <div>s
Look up css 'float' and try playing around with 'margin', 'padding', 'border' and 'background'

If this is too hard, you could perhaps do it in flash...it would look more slick and be easier to convert from photoshop.

Thanks, that really does help...

I have tried using floating DIVs before but i never truly understood them...

[as4s1n]

What is it you do not understand?

[misson]

I have tried using floating DIVs before but i never truly understood them...

The thread "CSS Issue" includes links to pages describing floats.

[cybrax]

Design is 'do-able' it's a basic two colum layout with header & footer go visit Dynamicdrive.com for a bare bones layout and see how it is done.

OR put the design to one side and just start with a single div on screen and play with the css, when you have the hang of it.. add a second div and so on.

Down and dirty content manager for the Q&A and News - http://www.cybrax.co.uk/a4_site/default.php
Its flat file storage not MSQL with a WYSIWYG upload form attached, very basic but versatile. (sorry about the large file size, still tinkering and a lot of junk in the folder)

Dynamic drive has some nice AJAX for displaying remote RSS feeds and a pagination javascipt that could work for the top news section, Yahoo pipes may also be useful for feeds.

The search box is bit more tricky though there are a few free PHP site search scripts out there or you might be able to alter a Google custom search box.

PS: the AJAX chat box is not allowed on x10 servers

[vrufusx65v]

*@cybrax*

That helps a whole lot, thank you very much.

@everyone

I was just thinking [before i looked at cybrax's post] that i could start off with just a big table with smaller tables in it and then convert them to DIVs and see what would happen...

[vrufusx65v]

Little side question as well:

how do i maintain the fonts on the page so they look just like the picture?

[as4s1n]

You could do a table layout but that is bad practice. It may be possible with a bunch of <div>s. As for your second question, are you asking which font face or how to get them all to look the same?

If it's the latter:

/* CSS page */
body
{
/* code above */
font-family: which-font-you-choose, backup-font;
}