Jack_
13th May 2007, 12:50 AM
I have no idea where to post this, because this has to do with a whole style, and have a lot of questions regarding the styling of this. This is an experiment, and I have no idea if it is going anywhere.
With that said, the idea is here:
http://generalchat.org
Now, there are several problems.
1. To make the tables look curved, I have to open every template and edit each one. There has to be an easier way...
2. The color scheme is not the best in the world, and I am wondering what is missing.
3. What are some other ways to make a table look curved? this is the technique I am using:
<div>
<b class="gc_breadcrumbs">
<b class="gc_breadcrumbs1"><b></b></b>
<b class="gc_breadcrumbs2"><b></b></b>
<b class="gc_breadcrumbs3"></b>
<b class="gc_breadcrumbs4"></b>
<b class="gc_breadcrumbs"></b>
</b>
<div class="gc_breadcrumbs_content">
Insert the template crap here
</div>
<b class="gc_breadcrumbs">
<b class="gc_breadcrumbs5"></b>
<b class="gc_breadcrumbs4"></b>
<b class="gc_breadcrumbs3"></b>
<b class="gc_breadcrumbs2"><b></b></b>
<b class="gc_breadcrumbs1"><b></b></b>
</b>
</div>Then the CSS
.gc_breadcrumbs
{
display:block;
}
.gc_breadcrumbs *
{
display:block;
height:1px;
overflow:hidden;
background:#D1DFF5;
}
.gc_breadcrumbs1
{
border-right:1px solid #D1DFF5;
padding-right:1px;
margin-right:3px;
border-left:1px solid #D1DFF5;
padding-left:1px;
margin-left:3px;
background:#D1DFF5;
}
.gc_breadcrumbs2
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
background:#D1DFF5;
margin:0 1px;
padding:0 1px;
}
.gc_breadcrumbs3
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
margin:0 1px;
}
.gc_breadcrumbs4
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
}
.gc_breadcrumbs5
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
}
.gc_breadcrumbs_content
{
background:#D1DFF5;
padding:0 5px;
}
*end breadcrumbs*/So the colors can be changed pretty easily. However, this method seems a bit messy to me, and there has to be a better way. Anybody willing to help?
Thanks.
With that said, the idea is here:
http://generalchat.org
Now, there are several problems.
1. To make the tables look curved, I have to open every template and edit each one. There has to be an easier way...
2. The color scheme is not the best in the world, and I am wondering what is missing.
3. What are some other ways to make a table look curved? this is the technique I am using:
<div>
<b class="gc_breadcrumbs">
<b class="gc_breadcrumbs1"><b></b></b>
<b class="gc_breadcrumbs2"><b></b></b>
<b class="gc_breadcrumbs3"></b>
<b class="gc_breadcrumbs4"></b>
<b class="gc_breadcrumbs"></b>
</b>
<div class="gc_breadcrumbs_content">
Insert the template crap here
</div>
<b class="gc_breadcrumbs">
<b class="gc_breadcrumbs5"></b>
<b class="gc_breadcrumbs4"></b>
<b class="gc_breadcrumbs3"></b>
<b class="gc_breadcrumbs2"><b></b></b>
<b class="gc_breadcrumbs1"><b></b></b>
</b>
</div>Then the CSS
.gc_breadcrumbs
{
display:block;
}
.gc_breadcrumbs *
{
display:block;
height:1px;
overflow:hidden;
background:#D1DFF5;
}
.gc_breadcrumbs1
{
border-right:1px solid #D1DFF5;
padding-right:1px;
margin-right:3px;
border-left:1px solid #D1DFF5;
padding-left:1px;
margin-left:3px;
background:#D1DFF5;
}
.gc_breadcrumbs2
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
background:#D1DFF5;
margin:0 1px;
padding:0 1px;
}
.gc_breadcrumbs3
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
margin:0 1px;
}
.gc_breadcrumbs4
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
}
.gc_breadcrumbs5
{
border-right:1px solid #D1DFF5;
border-left:1px solid #D1DFF5;
}
.gc_breadcrumbs_content
{
background:#D1DFF5;
padding:0 5px;
}
*end breadcrumbs*/So the colors can be changed pretty easily. However, this method seems a bit messy to me, and there has to be a better way. Anybody willing to help?
Thanks.