View Full Version : Border..the thin blue line.
Okay.. I have to know.
How would I go about making a thin border such as the one that is an option now with the UBB?.. on one of my HTML pages unrelated
to the UBB?
-----------
Paul
Justin
03-31-1999, 07:39 PM
View --> Source http://www.aota.net/ubb/wink.gif
Just make a table and set the border color, like this:
<table border=1 cellpadding=0 cellspacing=0 bordercolor=#0000CC>
<tr>
<td>
Cool!
</td>
</tr>
</table>
Hope this helps http://www.aota.net/ubb/smile.gif
------------------
Justin Nelson
FutureQuest Support
Justin..
Eeerrrrrrhhhhh (buzzer sound?) wrong answer. http://www.aota.net/ubb/smile.gif
Maybe I should reword.. I know how to make borders, but how do you make the "very" thin flat line in any color?.. without it looking like it rises from the page? Like the one now used in the UBB.
---------------------------
Paul
Michael G
03-31-1999, 08:51 PM
Paul:
What the UBB does is use nested tables (i.e. one table inside another). The outer table is filled with the blue color, and it is exactly 2 pixels larger in height and width of the inside table. The inner table contains a cell spacing of 1 pixel, so the blue from the outer table shows through in between cells as well as on the edges. This creates the illustion of a nice, neat border.
------------------
Michael L Gerenser
Web Designer
gerenser.com (http://gerenser.com)
Michael G:
Thanks.. that gets me closer. Now I have a table nested in a table.. but i am stuck, I
have the tables like this:
<CENTER> <TABLE BGCOLOR="#999999" WIDTH=597 HEIGHT=322><TR><TD>
<CENTER><TABLE BORDER=0 BGCOLOR="#FFFFFF" CELLSPACING=1 WIDTH=595 HEIGHT=320>
Blah.. blah.. blah
</TD></TR></TABLE></CENTER>
</TD></TR></TABLE></CENTER>
.. and I have what looks like a 2 pixel border on the left and top and a 1 pixel border on the right and bottom?..
(the right and bottom is the look I am trying for)
What did I miss?
Thanks
----------------
Paul
Justin
03-31-1999, 09:58 PM
http://www.vdj.net/paul.html
Try that http://www.aota.net/ubb/smile.gif
Paul, put the bgcolor in the TD tag instead of the table tag:
You have this:
<TABLE BGCOLOR="#999999" WIDTH=597 HEIGHT=322><TR><TD>
Change it to this:
<TABLE WIDTH=597 HEIGHT=322><TR><TD BGCOLOR="#999999">
Justin
03-31-1999, 11:03 PM
Actually that would work either way http://www.aota.net/ubb/smile.gif I have it like this:
<table border=0 bgcolor=#8080FF cellpadding=1 cellspacing=0>
<tr><td align=center valign=center>
<table border=0 cellpadding=4 cellspacing=0 bgcolor=#FFFFFF>
<tr><td>I'm inside a thin blue line - hehe http://www.aota.net/ubb/smile.gif</td></tr></table>
</td></tr></table>
Don't specify the size of the outer one, as it will size around the inner one. The cellpadding of 1 will set it to a border of 1 pixel since there is 1 pixel of space between the cell and it's contents. Then you specify the bgcolor for the inner table the same as the page background (or different, doesn't matter) and the result is a thin blue line http://www.aota.net/ubb/smile.gif
------------------
Justin Nelson
FutureQuest Support
Paul,
If you really like the look of a flat line of color, with size as thin as 1 pixel, there's an interesting hack you can play with. I've seen it used in some very creative and complex ways, and I can't wait for time to really play with it more myself.
It goes like this:
Create a tiny image. Fill it with your favorite browser safe color. Crop it down so that it is only 1 pxel by 1 pixel in size.
(I find that easier than working with a 1 pixel image ;-O )
Name it, ( I usually use eg, bluedot.gif...)Put it anywhere you wish, using the Height & Width attributes to draw it on your page. So, you could do (I'm killing the <>'s here)
img src="/bluedot.gif" width=1 height=300 hspace=o vspace=0
to draw a long VERY thin vertical line of blue.
They take up less than 1 kb space, but remember that for each 4 uniques, another call is made to the server. (so I read, but have seen that concept challenged - Deb or Andrew would know)
The fun has just begun! I've played with using eg 4x4 pixels of browser safe colors to create a blend that would translate well, and other fun stuff. Then I had to get back to work ;-) ...
Beware, this is a hack, and will not get you any points with the html purists out there. But while I try very hard to keep it simple and clean, there are times...
Have fun!
DKG
PS. Remember the drawbacks of embeded tables, and keep in mind that some versions of Netscape don't recognise the bgcolor attribute.
Great!..
Thanks to everyone I am the proud owner of a "brand spanking new", great looking, one time ..limited offer, uh..whoa.. I digress.
THANKS
----------------
Paul
Jacob Stetser
04-01-1999, 12:41 AM
Hidy ho, good neighbors!
There's a VERRRRY simple way of getting the "thin blue line" you're looking for (isn't that a movie?
to wit:
<table border="0" cellspacing="1" bgcolor="blue">
<tr>
<td bgcolor="white"><font face="Verdana,Arial,Helvetica,san serif" size="2"><nobr>
</tr></td></table>
Basically, in the <TABLE> tag you set the cellspacing attribute to the width of your desired line and the bgcolor of the table to the color of your desired line.
Then, EACH cell in the table (<td> ), gets a BGCOLOR attribute.
Works a LOT better than nested tables, I think.
Jake
{AHEM: At least, in IE it works :P back to the drawing board. -j}
[This message has been edited by Jacob Stetser (edited 04-01-99).]
Justin
04-01-1999, 03:15 AM
I haven't tried it, but I think Netscape doesn't support TD bgcolors - but it does support TABLE bgcolors, which is why I chose the way I did. I'm not sure though...
Dean B
04-01-1999, 07:46 AM
My two penneth' http://www.aota.net/ubb/smile.gif
Firstly Justin, NN does support TD bg colour http://www.aota.net/ubb/smile.gif
I use the 1 x 1 pixel image trick a lot You can create some great little graphics with a file less than 1k in size.
Stop by here, they have some great tips (1x1, preloading etc)
webreview.com/wr/pub/98/01/02/feature/index.html (http://webreview.com/wr/pub/98/01/02/feature/index.html)
Dean.
[This message has been edited by Dean B (edited 04-01-99).]
While the latest versions of NN support TD BGColor, vs 3.x either don't at all, or are undependable...I apologise for not being more specific, but I don't have time to look it up...run a Deja News search? It really shines when dealing with things like this that may be undocumented elsewhere.
Dean B
04-02-1999, 05:08 AM
Why not upgrade your browsers to ver 4.* of each ?
The're both free....
------------------
Regards, Dean.
**DMCity Web Board**
www.dmcity.com/cgi-bin/ubb/Ultimate.cgi (http://www.dmcity.com/cgi-bin/ubb/Ultimate.cgi)
Well Dean :-)
I do keep mine upgraded, even run betas at times. It's the people visiting who I can't control...
As much as I would like to ask people to upgrade theirs, I understand that that isn't considerate of those who, for whatever reason, would find that to be a problem.
Having said that...
The designer has every right to design for the latest browsers, and no one should judge them. My only advice is to be informed.
In this case...If NN doesn't show your black background, your white text will not show =/.
There are simple work-arounds that can be used as long as you know to look.
DeAnna
(who prays that older browsers will prove to be non-Y2k compliant)
(who prays that older browsers will prove to be non-Y2k compliant)
Amen and Hallelujah!
vBulletin® v3.6.8, Copyright ©2000-2012, Jelsoft Enterprises Ltd.