Good art is a taste, good design is an opinion.


Come as guest, stay as family.
Board Index

Come as guest, stay as family.


You are not connected. Please login or register

Foto

[CSS] Table for solved



View previous topic View next topic Go down Message [Page 1 of 1]

1
Offline

  Zyon

avatar
Punbb Guru
Punbb Guru
Hey all,

Now I will show you how to make this table in css or BBCode! So let's start!

Table:
Text Here
Here is code what you need to put in your css:
Code:
.solved {
  background: url('http://i42.servimg.com/u/f42/14/52/34/74/sol10.png') no-repeat 6px #CDE3A4;
  border: 1px solid #A8C471;
  color: #436500;
  padding: 6px 6px 6px 28px;
  width: 99%;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset;
  font-weight: bold;
  border-radius: 3px 3px 3px 3px;
}
and when you want to put that table in post, just use this:

a) HTML Code
Code:
<div class="solved">TEXT HERE</div>
b) BBCode (for this in css)
Code:
[table class="solved"][tr][td]TEXT HERE[/td][/tr][/table]
And if you don't want to use css, or you writte on some other forum that, use this BBCode code
Code:
[table style="background: url('http://i42.servimg.com/u/f42/14/52/34/74/sol10.png') no-repeat 6px #CDE3A4; border: 1px solid #A8C471; color: #436500; padding: 6px 6px 6px 28px; width: 99%; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55); box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.2) inset; font-weight: bold; border-radius: 3px 3px 3px 3px;"][tr][td]Text Here[/td][/tr][/table]
That's all! Enjoy!
Zyon

Maybe later I will add more tables, and you can reply on this topic if you want your own table Smile

Powered by PunBB
Currently 0 users have thanked Zyon for this post:

2
Offline

  Shadow

avatar
Administrator
Administrator
<div class="solved">Tutorial accepted, 80 points added ! Smile</div>

Powered by PunBB
Currently 0 users have thanked Shadow for this post:

3
Offline

  J0k3R^

avatar
Pemanently Banned
Pemanently Banned
very good Smile

check mine, just html Smile

Code:
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" /></head>
TRUE<br /><br /><table style="background: url('http://cdn5.iconfinder.com/data/icons/fatcow/32x32/tick.png') no-repeat left center #d7e2b7; border: 1px solid #1A5700; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #1A5700; border-radius: 3px;"><tr><td align="left" align="left">Topic Solved + Locked</td></tr></table>
<br /><br />
FALSE<br /><br /><table style="background: url('http://cdn2.iconfinder.com/data/icons/oxygen/32x32/actions/list-remove.png') no-repeat left center #EBD9D9; border: 1px solid #7D0000; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #7D0000; border-radius: 3px;"><tr><td align="left" align="left">Topic Locked</td></tr></table>
<br /><br />
NOTE<br /><br /><table style="background: url('http://i.imgur.com/BZ17N.png') no-repeat left center #BDE5F8; border: 1px solid #00529B; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #00529B; border-radius: 3px;"><tr><td align="left" align="left">Information</td></tr></table>


Powered by PunBB
Currently 0 users have thanked J0k3R^ for this post:

4
Offline

  Zyon

avatar
Punbb Guru
Punbb Guru
J0k3R^ wrote:[link="/t72-css-table-for-solved#2659"]very good Smile

check mine, just html Smile

Code:
<head><meta http-equiv="content-type" content="text/html; charset=utf-8" /></head>
TRUE<br /><br /><table style="background: url('http://cdn5.iconfinder.com/data/icons/fatcow/32x32/tick.png') no-repeat left center #d7e2b7; border: 1px solid #1A5700; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #1A5700; border-radius: 3px;"><tr><td align="left" align="left">Topic Solved + Locked</td></tr></table>
<br /><br />
FALSE<br /><br /><table style="background: url('http://cdn2.iconfinder.com/data/icons/oxygen/32x32/actions/list-remove.png') no-repeat left center #EBD9D9; border: 1px solid #7D0000; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #7D0000; border-radius: 3px;"><tr><td align="left" align="left">Topic Locked</td></tr></table>
<br /><br />
NOTE<br /><br /><table style="background: url('http://i.imgur.com/BZ17N.png') no-repeat left center #BDE5F8; border: 1px solid #00529B; padding: 5px 5px 5px 40px; width: 97%; font-weight: bold; color: #00529B; border-radius: 3px;"><tr><td align="left" align="left">Information</td></tr></table>


Oh. How you can write so much lol!

you can use div in place of table, and inside of div in style put that. You don't need head body and nothing else.

If you want one example post.

Powered by PunBB
Currently 0 users have thanked Zyon for this post:

5
Offline

  J0k3R^

avatar
Pemanently Banned
Pemanently Banned
yeah, okey, i just replaced some of your css codes with my settings and colors so now i have gone with ur way. thanks ^^

Powered by PunBB
Currently 0 users have thanked J0k3R^ for this post:

6
Offline

  Julinho

avatar
Punbb Rookie
Punbb Rookie
thank you.

Powered by PunBB
Currently 0 users have thanked Julinho for this post:

7
Offline

  Sponsored content



Powered by PunBB
Currently 0 users have thanked Sponsored content for this post:

View previous topic View next topic Back to top Message [Page 1 of 1]


Topic URL's

URL
BBcode
HTML

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