Help

View previous topic View next topic Go down

grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 9:05 am

I made a table with border image, but it seams to not look right or be right. can somebody help make it look better?
Code:
<div><table border=0 cellspacing=0 colspan=100% width=50%><tr>
<td width=18 height=20 background=http://i43.tinypic.com/33yrji1.png></td>
<td height=20 background=http://i39.tinypic.com/33w6vdi.png></td>
<td width=18 height=20 background=http://i40.tinypic.com/256wakj.png></td></tr><tr>

<td width=18 background=http://i39.tinypic.com/2rnu6w4.png></td>
<td><table colspan=100% boder=0 cellspacing=0>
<td background=http://i39.tinypic.com/17wg8z.png height=30>Title Goes Here
</td></tr></table>Placew main text here, located under the tite.</td>
<td width=18 background=http://i39.tinypic.com/2rnu6w4.png></td>

</tr><tr>
<td width=18 height=20 background=http://i41.tinypic.com/1z5jl02.png></td>
<td height=20 background=http://i44.tinypic.com/2w71d76.png></td>
<td width=18 height=20 background=http://i44.tinypic.com/2d1vek4.png></td></tr>
</table></div>















Title Goes Here
Placew main text here, located under the tite.
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 9:27 am

Can I ask, what are you trying to make it do?

Depending on what you are trying to do with the table. It is possible that I can reproduce it using divs and css to make it look similar.

Edit: I made this with divs and a small bit of css in about 5mins.

Title Goes Here
Place main text here, located under the title.

grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 10:20 am

Yeah i was trying to make something like that. I know not much css and beginner in html.though with a border more like the original one i made.
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 11:14 am

So something a bit more like this?

Title Goes Here
Place main text here, located under the title.



















Title Goes Here
Placew main text here, located under the tite.

Placew main text here, located under the tite.


Last edited by Vanilla990 on 6/3/2012, 1:31 pm; edited 37 times in total
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 12:44 pm

is it possible to add light highlights to make it more 3-d?
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 12:56 pm

i mean like higlights in the center of the lines of like light hitting it.if you look at the green lines of the origonal one i made.
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 12:59 pm

I know, I am trying to work out a way at the moment. What you are after is a sort of bevel boss effect on the border but I'm struggling to make it look good.
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 1:04 pm

i can see how hard it is. Thats why i started with pictures.
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 1:06 pm

mmhm, That's the one benefit of using pictures for this sort of thing, you can make it look exactly the way you want it without any trouble. The good thing about css is you don't have to re-upload any images if you change it and it can automatically size.
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 1:08 pm

would it be easyer if i give you the URLs for all the images i used?
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 1:16 pm

I don't think there is much I can do with your current one because of the way it 's made. I'm not saying it's badly made, I actually think it's a rather clever way of doing it but it's a pain to try and customise.

If you want I can paste the code I used to make the one I was working on so you can mess around with that yourself.

Maybe someone else on here might be able to offer some assistance.
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 1:20 pm

Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 1:35 pm

Ok, using those images I've managed to get it to look like this so far:






















Title Goes Here
Placew main text here, located under the tite.


Last edited by Vanilla990 on 6/3/2012, 1:41 pm; edited 1 time in total
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 1:36 pm

that looks like how i was trying to make it.thank you.
Vanilla990
Vanilla990
Administrator
Forum Posts : 114
Member Since : 2011-10-30

PostVanilla990 6/3/2012, 1:42 pm

Well here is the code used for it. I took your original code and then when you added those new images I split the middle row into 2 and then set a background colour for the middle part instead of using the image.

Code:

<div>
<table border=0 cellspacing=0 colspan=100% width=50%>
<tr>
<td width=18 height=20 background=http://i42.tinypic.com/30lktvk.png></td>
<td height=20 background=http://i40.tinypic.com/aexut5.png></td>
<td width=18 height=20 background=http://i40.tinypic.com/5nvop.png></td>
</tr>
<tr>
<td width=18 background=http://i44.tinypic.com/290y2wk.png></td>
<td style="background-color:#C3C3C3;font-size:18px;padding-bottom:4px;"><center>Title Goes Here</center></td>
<td width=18 background=http://i44.tinypic.com/34ovbzn.png></td>
</tr>
<tr>
<td width=18 background=http://i39.tinypic.com/2rnu6w4.png></td>
<td>Placew main text here, located under the tite.</td>
<td width=18 background=http://i39.tinypic.com/2rnu6w4.png></td>
</tr>
<tr>
<td width=18 height=20 background=http://i41.tinypic.com/1z5jl02.png></td>
<td height=20 background=http://i44.tinypic.com/2w71d76.png></td>
<td width=18 height=20 background=http://i44.tinypic.com/2d1vek4.png></td></tr>
</table></div>
grimofdoom
grimofdoom
Member
Member
Forum Posts : 106
Member Since : 2012-03-06

Postgrimofdoom 6/3/2012, 1:43 pm

Thank you. it will be very usefull for me in the future.(Aspecialy since now it can be used as a template and object at the same time)
Mike
Mike
Administrator
Forum Posts : 446
Member Since : 2011-10-28
http://www.codinghelp.org

PostMike 6/3/2012, 2:14 pm

As this is solved, I'll lock it. If you need it re-opening please send me a PM!
Sponsored content

PostSponsored content

View previous topic View next topic Back to top

Create an account or log in to leave a reply

You need to be a member in order to leave a reply.

Create an account

Join our community by creating a new account. It's easy!


Create a new account

Log in

Already have an account? No problem, log in here.


Log in

 
Permissions in this forum:
You cannot reply to topics in this forum