hey guys, help me out here please, im totally lost

[rik18]

Hey guys,Im new to html and Im trying to create a partial CV site page for a friend however I am totally lost with how to do this.My friend have me a site structure to follow but I really dont know anything about creation of this design.The structure is;Main table - 2 columns, 3 rows, centre align, widthRow 1Header - cell background colourfont size, colour, bookmarkBlankRow 2Navigation - background image, top valign, rowspanfont sizeunordered list - 3 bookmark hyperlinksContent - 3 tablesTable 1 - centre alignment, background colour, widthright align, bookmark, font sizecontentright align, bookmark hyperlink, font sizeTable 2 = Table 1Table 3 = Table 1Date - right align, smallCould someone please help me with the code for this, I have to get this done asap and so far I am totally lost with it.Thanks in advance;Rik

[Jonas]

Why did you take it upon yourself to make that if you didn't know how? Anyway, we'll see if we can't give you a few nudges in the right direction at least. The "policy" on this forum is we don't like to provide you with complete code for a site, but rather help you fix errors with code you already have, or explain concepts to you, so you can actually try and learn something as well. Your explanation isn't easy to read through and understand. Could you perhaps make a drawing of your table in MS Paint, and post here with that picture as an attachment? You might want to write in table column/row percentage (how much of the page you want it to make out). If this is very urgent, I suppose we can help.

[rik18]

Why did you take it upon yourself to make that if you didn't know how? Anyway, we'll see if we can't give you a few nudges in the right direction at least. The "policy" on this forum is we don't like to provide you with complete code for a site, but rather help you fix errors with code you already have, or explain concepts to you, so you can actually try and learn something as well. Your explanation isn't easy to read through and understand. Could you perhaps make a drawing of your table in MS Paint, and post here with that picture as an attachment? You might want to write in table column/row percentage (how much of the page you want it to make out). If this is very urgent, I suppose we can help.

<{POST_SNAPBACK}>

Hey thanks,Yeah, this is very urgent unfortunately, really needs to be finished tonight so your help is greatly greatly appreciated.Page ScreenIs the screenshot of the design he is looking for.Thanks in advance

[scott100]

Does this help you get started?

<table border="1" style="width:100%"><tr><td style="width:25%;background:green">CV Contents</td><td style="width:75%"> </td></tr><tr><td rowspan="3" valign="top" style="background:teal"><ul><li>Personal Details</li><li>Education</li><li>Work Experience</li></ul></td><td style="background:lightgreen"><p style="text-align:right">Personal Details</p>Personal Details<br /><br /><br /><br /></td></tr><tr><td style="background:lightgreen"><p style="text-align:right">Education</p>Education<br /><br /><br /><br /></td></tr><tr><td style="background:lightgreen"><p style="text-align:right">Work Experience</p>Work Experience<br /><br /><br /><br /></td></tr></table>

[rik18]

Does this help you get started?

<table border="1" style="width:100%"><tr><td style="width:25%;background:green">CV Contents</td><td style="width:75%"> </td></tr><tr><td rowspan="3" valign="top" style="background:teal"><ul><li>Personal Details</li><li>Education</li><li>Work Experience</li></ul></td><td style="background:lightgreen"><p style="text-align:right">Personal Details</p>Personal Details<br /><br /><br /><br /></td></tr><tr><td style="background:lightgreen"><p style="text-align:right">Education</p>Education<br /><br /><br /><br /></td></tr><tr><td style="background:lightgreen"><p style="text-align:right">Work Experience</p>Work Experience<br /><br /><br /><br /></td></tr></table>

<{POST_SNAPBACK}>

Thanks so much man! Although with this, I still really am lost with it, I can edit the colors no problem but outside of that I really have no idea where to go. I mean, I think Im editing the right thing, I click refresh and suddenly half the table dissapears. As for the nested tables, with those I really have no idea. Any chance you could copy up the rest of this design if thats a small enough job, I would really like to learn and understand this stuff and I feel that by seeing this complete I can study it and learn from the mistake I made.Thanks in advance and thanks so much for the time you sacrificed to do this.Rik

[sbrownii]

search the net for "css 2 column layout"( Tables are the anti-css so I have to show you how to do it the right way... lol )You will find many things to look at - so look through them, try to use them, and if you have problems ask back here.A short summary of the general idea is to use to div elements for your two columns (I just call them left and right here). Then put your rows for the second column inside the div that represents the second column.For example:

<div class="left">     left column</div><div class="right">    right column    <div class="row">Row 1</div>    <div class="row">Row 2</div>    <div class="row">Row 3</div></div>

After you have that general structure, adapt some of the ideas you find in your search.This is a very, very simple 2 column layout with borders so you can see where things end up:

.left{float:left;margin:0px;border: solid red 2px;width:20%;}.right{float:left;margin-left:0px;width:80%;border: solid orange 2px;}.row{border: dashed black 2px;margin: 5px;margin-bottom: 20px;}

Just add definitions for font "color", "background" color, padding, etc...To get your headings for each row just put them in some block level element inside the div for that row. You could try h3 or just a div if you want. Either way, if you set the class attribute on your row headings you can use the following to get them to align right

.row .header{margin: 2px 0px;text-align:right;}

[Jonas]

I don't have the time to make the whole HTML page for you today, because, frankly, I'm on Oslo time, and so the day is almost over (I should really be going to bed ), but I can just comment on important thing about that design that others can use to get the results you want:The list:

• Personal Details
• Education
• Work Experience

look like they're also links, but links that don't link anywhere but within the document, meaning they are bookmark links:http://www.w3schools.com/html/tryit.asp?fi..._link_locationsI guess this on the basis that the layout is meant for long lists of detailed CV information, and each part has a "Top" link. So you should definetely include that, it could be useful for an online CV.Good luck though. Hope someone can help you within the time your day ends. (Really worldwide spread community, this.)

[scott100]

As for the nested tables, with those I really have no idea. Any chance you could copy up the rest of this design if thats a small enough job,

<{POST_SNAPBACK}>

hows this?

<table border="1" style="width:100%"><tr><td style="width:25%;background:green;color:white"><br />CV Contents</td><td style="width:75%"> </td></tr><tr><td rowspan="3" valign="top" style="background:teal"><ul><li>Personal Details</li><li>Education</li><li>Work Experience</li></ul></td><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Personal Details</p>Personal Details<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td></tr><tr><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Education</p>Education<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td</tr><tr><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Work Experience</p>Work Experience<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td</tr></table>

[rik18]

hows this?

<table border="1" style="width:100%"><tr><td style="width:25%;background:green;color:white"><br />CV Contents</td><td style="width:75%"> </td></tr><tr><td rowspan="3" valign="top" style="background:teal"><ul><li>Personal Details</li><li>Education</li><li>Work Experience</li></ul></td><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Personal Details</p>Personal Details<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td></tr><tr><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Education</p>Education<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td</tr><tr><td style="background:lightgreen" align="middle"><table border="1" cellpadding="5" style="width:90%;height:90%"><tr><td><p style="text-align:right">Work Experience</p>Work Experience<br /><br /><br /><br /><p style="text-align:right">Top</p></td></td></table><br /></td</tr></table>

<{POST_SNAPBACK}>

Hey man,Thanks so much for taking the time to do this, you rule man!with lots of thanks,Rik

[scott100]

No problem, happy to help