Need help on my PS to HTML design

muguih · #1 (**permalink**) 11-03-2006, 01:53 AM

guys! im a beginner at using PS to HTML.
id go straight to the point.
the thing is, i have made my design and i exported it to html, all slices where done. now my problem is how to put a table over my image body.
the one that i allocated as my body, once i made a table over it, it disarranges.
example:

heres my sample code:

<td colspan="3" rowspan="6">
<img src="blah.jpg" height="" weight="">
</td>

what will i do to be able to put text and create a table?

thanks a lot. ive been having problems with these.
thank you very much.

curtiss · #2 (**permalink**) 11-03-2006, 06:26 AM

You should use the images as your table background instead of simply placing them inside the tables.

It would look more like:

Code:

<td colspan="3" rowspan="6" style="background: #000 url('blah.jpg')";>
This is the content of your table cell
</td>

Be aware, though, that using tables for strictly layout purposes is now considered bad form in HTML. Tables should only be used for presenting tabular data.

Leprakawn · #3 (**permalink**) 11-03-2006, 09:38 AM

Totally agree. Tables are in a sinking ship, and DIV/CSS is the way to go.

muguih · #4 (**permalink**) 11-03-2006, 08:16 PM

here is my sample code; check in the middle where my problem really is. thank you.

<html>
<head>
<title>josh</title>

</head>


<table id="Table_01" width="801" height="601" border="0" cellpadding="0" cellspacing="0">
<tr>
<td colspan="6">
<img src=http://mail.yahoo.com/config/login?/"images/josh_01.gif" width="800" height="47" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="47" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src=http://mail.yahoo.com/config/login?/"images/josh_02.gif" width="387" height="54" alt=""></td>
<td colspan="2" rowspan="2">
<img src=http://mail.yahoo.com/config/login?/"images/josh_03.gif" width="413" height="61" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="54" alt=""></td>
</tr>
<tr>
<td rowspan="19">
<img src=http://mail.yahoo.com/config/login?/"images/josh_04.gif" width="8" height="499" alt=""></td>
<td rowspan="2">
<img src=http://mail.yahoo.com/config/login?/"images/josh_05.gif" width="136" height="23" alt=""></td>
<td colspan="2" rowspan="6">
<img src=http://mail.yahoo.com/config/login?/"images/josh_06.gif" width="243" height="63" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="7" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="5">
<img src=http://mail.yahoo.com/config/login?/"images/josh_07.gif" width="413" height="56" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_08.gif" width="136" height="6" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="6" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_09.gif" width="136" height="24" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="24" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_10.gif" width="136" height="4" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="4" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src=http://mail.yahoo.com/config/login?/"images/josh_11.gif" width="136" height="25" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="6" alt=""></td>
</tr>
<tr>
<td rowspan="13">
<img src=http://mail.yahoo.com/config/login?/"images/josh_12.gif" width="25" height="436" alt=""></td>




<td background=http://mail.yahoo.com/config/login?/"images/josh_13.gif" colspan="2" rowspan="12"></td>





<td rowspan="13">
<img src=http://mail.yahoo.com/config/login?/"images/josh_14.gif" width="19" height="436" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="19" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_15.gif" width="136" height="6" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="6" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_16.gif" width="136" height="23" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="23" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_17.gif" width="136" height="7" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="7" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_18.gif" width="136" height="23" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="23" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_19.gif" width="136" height="8" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="8" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_20.gif" width="136" height="23" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="23" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_21.gif" width="136" height="6" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="6" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_22.gif" width="136" height="26" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="26" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_23.gif" width="136" height="6" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="6" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/josh_24.gif" width="136" height="23" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="23" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src=http://mail.yahoo.com/config/login?/"images/josh_25.gif" width="136" height="266" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="211" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src=http://mail.yahoo.com/config/login?/"images/josh_26.gif" width="612" height="55" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="1" height="55" alt=""></td>
</tr>
<tr>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="8" height="1" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="136" height="1" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="25" height="1" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="218" height="1" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="394" height="1" alt=""></td>
<td>
<img src=http://mail.yahoo.com/config/login?/"images/spacer.gif" width="19" height="1" alt=""></td>
<td></td>
</tr>
</table>


</html>

saber_kite · #5 (**permalink**) 02-12-2007, 03:40 AM

Uhm, I'm very much a newbie at the PS to Dreamweaver technique, and I don't really know codes much (unless I'm tweaking a pre-existing one for my blog and stuff. My question is, using this method, how can I make CSS? I mean, if I use this method it's going to have the <td> code all over right? And on the body I'm going to be using a table. So how can I put CSS?

*hope you don't mind I kinda crashed in this topic. I didn't want to make a new one since my question's similar*