|
|
Post a Project »
Find a Professional HTML Freelancer!
Find a Freelancer to help you with your HTML projects
| |
|
 |
|
|
10-21-2009, 03:52 PM
|
two cell table matrix
|
Posts: 216
|
Well, I'd just like to create a two cell table matrix that I can duplicate, and position side by side, and change the color and border thickness.
Can someone provide the html and css for that? please
thanks
|
|
|
|
|
10-21-2009, 04:11 PM
|
Re: two cell table matrix
|
Posts: 41,517
Name: Chris Hirst
Location: Blackpool. UK
|
change the outer border or the cell borders?
each "table" side by side? or?
A picture would be easier to get an idea from but it should be simple enough with lists rather than getting into "divitus" territory
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?
|
|
|
|
|
10-21-2009, 04:23 PM
|
Re: two cell table matrix
|
Posts: 216
|
Thanks for your reply.
I'm using this code, but I'm sure it's probably using old tags and needs to be more css friendly I'm guessing. I'd like this code, or a css equivalent to put the tables side by side, please. thanks.
Code:
<table width="100" border="1" cellspacing="0" cellpadding="12" bordercolor="#000000">
<tr>
<td bgcolor="#FFFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font color="#800000">Type</font></font></b></font></p>
<p align="left"><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></font></p>
</td>
<td width="60%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000">Number</font></b></font></p>
<p><font size="1" face="Verdana, Arial, Helvetica, sans-serif"></font></p>
</td>
</tr>
<tr>
<td width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#800000">A</font></b></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"></font></p>
</td>
<td bgcolor="#FFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000"><b>1</b></font></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></p>
</td>
</tr>
</table>
<br>
<table width="100" border="1" cellspacing="0" cellpadding="12" bordercolor="#000000">
<tr>
<td bgcolor="#FFFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font color="#800000">Type</font></font></b></font></p>
<p align="left"><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></font></p>
</td>
<td width="60%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000">Number</font></b></font></p>
<p><font size="1" face="Verdana, Arial, Helvetica, sans-serif"></font></p>
</td>
</tr>
<tr>
<td width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#800000">A</font></b></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"></font></p>
</td>
<td bgcolor="#FFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000"><b>1</b></font></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></p>
</td>
</tr>
<tr>
<td bgcolor="#FFFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font color="#800000">B</font></font></b></font></p>
<p align="left"><font face="Verdana, Arial, Helvetica, sans-serif" size="2"><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></font></p>
</td>
<td width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000">2</font></b></font></p>
<p><font size="1" face="Verdana, Arial, Helvetica, sans-serif"></font></p>
</td>
</tr>
<tr>
<td width="50%">
<p align="center"><font color="#FFFFFF"><b><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#800000">C</font></b></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"></font></p>
</td>
<td bgcolor="#FFFFF" width="50%">
<p align="center"><font color="#FFFFFF"><font face="Verdana, Arial, Helvetica, sans-serif" size="2" color="#000000"><b>3</b></font></font></p>
<p><font face="Verdana, Arial, Helvetica, sans-serif" size="1"></font></p>
</td>
</tr>
</table>
|
|
|
|
|
10-21-2009, 04:33 PM
|
Re: two cell table matrix
|
Posts: 41,517
Name: Chris Hirst
Location: Blackpool. UK
|
Ok lets see what I can come up with  , probably tomorrow (GMT) when I post now though.
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?
|
|
|
|
|
10-21-2009, 05:12 PM
|
Re: two cell table matrix
|
Posts: 41,517
Name: Chris Hirst
Location: Blackpool. UK
|
Ok maybe I just need more of a challenge.
http://www.modtalk.co.uk/_site/code/css/two-cell-list/
CSS
Code:
ul.table {
width:49%;
margin: 1.2em 0 0 1px;
float:left;
list-style-type: none;
padding:0;
}
ul.table li {
height:1em;
margin:0;
padding:0;
}
ul.table li div{
width: 49%;
height: 100%;
float: left;
clear:right;
text-align:left;
color:black;
padding:0 0 0 .2em;
}
ul.table li div:first-child {
color:blue;
float: left;
clear:none;
}
#a {
border: 1px solid blue;
}
#b {
border: 1px solid red;
}
#c {
border: 1px solid green;
}
#d {
border: 1px solid orange;
}
HTML Code:
<ul class="table" id="a">
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
</ul>
<ul class="table" id="b">
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
</ul>
<ul class="table" id="c">
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
</ul>
<ul class="table" id="d">
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
<li><div>Cell 1</div><div>Cell 2</div></li>
</ul>
__________________
Chris. ->> Links are advertising NOT optimising!! <<-
A foolish consistency is the hobgoblin of little minds
Thought for today:- I SEO the only industry where all the cowboys are Indians?
|
|
|
|
|
10-22-2009, 10:36 PM
|
Re: two cell table matrix
|
Posts: 216
|
Thank you
|
|
|
|
|
|
« Reply to two cell table matrix
|
|
|
| Thread Tools |
Search this Thread |
|
|
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|
