Home Messages Index
[Date Prev][Date Next][Thread Prev][Thread Next]
Author IndexDate IndexThread Index

Re: How to modify table borders?

__/ [Ellie C] on Monday 09 January 2006 16:37 \__

> Roy Schestowitz wrote:
> 
>> __/ [Ellie C] on Sunday 08 January 2006 16:52 \__
>> 
>> 
>>>Hi,
>>>
>>>I would like to modify the look of a table border and I can't figure out
>>>how to do it. I wonder if anyone in this groupo can help. I saw the look
>>>I want on a website (http://www.annestahl.com). The table under her name
>>>has the look I want - making it loo like a raised area without the inner
>>>border that you get with the usual table boders. I looked at the source
>>>for this page and saw that this was done with CSS. I'm completely
>>>unschooled in CSS but I tried copying the stuff in the referenced file.
>>>But when I try adding this to my own page it dosen't work. Can anyone
>>>give me some ideas?
>>>
>>>Thanks,
>>>
>>>Ellie
>>>
>>>Here's the "code"
>>>
>>>body {
>>>background-color:#CCCC99;
>>>font-family: "Century Gothic", "Lucida Sans Unicode", "Trebuchet MS",
>>>Verdana;
>>>}
>>>a:hover { color:red }
>>>a:link {color:#444200}
>>>a:active {color:#ff0000}
>>>a:visited {color:#666666}
>>>table.menu {border
>>>border: #999900;
>>>border-top: 1px solid #FFFFFF;
>>>border-right: 1px solid #999999;
>>>border-bottom: 1px solid #999999;
>>>border-left: 1px solid #FFFFFF;
>>>}
>>>.table1 {
>>>border-top-width: 1px;
>>>border-right-width: 1px;
>>>border-bottom-width: 1px;
>>>border-left-width: 1px;
>>>border-top-style: solid;
>>>border-top-color: #999999;
>>>border-right-color: #999999;
>>>border-bottom-color: #999999;
>>>border-left-color: #999999;
>>>}
>>>h2 {
>>>font-size: 16px;
>>>}
>>>.smtext {
>>>font-size: 12px;
>>>}
>> 
>> 
>> You probably needn't bother with CSS for this. I saw the table in
>> question. Have you looked at the standard attribute for tables in HTML?
>> Have you bound your table to the class table1 or menu at all? There is
>> nothing too sophisticated in the styles. There is also excess in terms of
>> the number of repeated declarations and attributes. Put the style in your
>> header or within a peripheral CSS file (link to it). You only need to make
>> use of the classes then (class="foo").
>> 
>> Best wishes,
>> 
>> Roy
>> 
>> PS - Try to learn HTML and be inspired by sites of higher quality. You
>> might adopt some bad habits or reflect badly on your site if you borrow
>> code and examples from the wrong places.
> 
> Yeah, I looked at the attributes for TABLE but couldn't find anything
> that eliminated the "inner" border on tables. For instance, you set the
> top border to a light color and the bottom border to a dark color, sure
> you get the light color along the top and left side and the dark color
> along the bottom andlefet side. But you also get a thinner line of the
> opposite color on the inner edge of the table border. If you notice the
> table in the web site I want to copy, there is no inner edge at all, so
> that the table, in effect, looks like a raised, solid rectangle on the
> page, whereas the typical table border looks like a raised hollow
> rectangle around the table contents.


Yes,  I agree that it looks unordinary and quite all right. The site as  a
whole  does  not  look professional though. Building it in such a  way  is
old-stylish  in my humble opinion. What happened to standards-based design
that  exploits full separation between content and layout? The site  above
is  not terrible, but I have seen far nicer menus and tables, which often,
but not always, exploit tiny graphics files.


> I did learn HTML some years ago - and found it to be the easiest but
> most boring "programming" language I ever used. HTML is like programming
> with all the hard and interesting parts taken out and all the boring
> parts multiplied by 1000. It's a language without verbs, only nouns and
> adjectives... ;-)

Beautiful analogy. Use/hack/learn PHP then...

[Date Prev][Date Next][Thread Prev][Thread Next]
Author IndexDate IndexThread Index