Web Design Forums

jimbofoxman · 25-01-2005, 16:10

Ok, excuse this noobie question, but I am slowly picking this up.

Basically I am tryin to setup a layout based on tables, but I want to give a small table inside that some different css values, like borders, colors, etc.

Can I do this? And how.....? I tried adding table1 and table2 in the css file, but I can't seem to do anything with it in the html portion.

Thanks

Jim

smallbeer · 25-01-2005, 17:35

are table1/table1 classes/ids? i.e.

.table1 {
do something wondeful: now;
}

jimbofoxman · 25-01-2005, 18:02

The Body and Table1 were created through Dreamweavers CSS util. Well table1 was done as table and then changed to table1. Border info from Table1 was deleted in the interim while I was doin some more messin around.

a.nav, a.nav:link, a.nav:visited {
display:block;
width:140px;
height:20px;
background:#000;
border:1px solid #988d6b;
margin-top:2px;
text-indent:5px;
text-align:left;
text-decoration:none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#c7bb94;
line-height:20px;
overflow:hidden;
}
a.nav:hover {color:#c7bb94; background:#5d4d33;}
a.nav:active {
color:#000;
background:#c7bb94;
}
body {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #C7bb94;
background-color: #000000;
}
table1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 20px;
color: #C7BB94;
}h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
font-weight: bold;
color: C7BB94;
}

pgo · 26-01-2005, 02:11

Quote:

Originally Posted by jimbofoxman

table1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 20px;
color: #C7BB94;

Well, this CSS rule confuses me. "table1" is not a valid HTML element (tag). "table1" would be a class or an id - in which case you'd denote it as .table1 or #table1 respectively.

To embed tables within each other and then style them, you'll need to apply classes to each (or id's, but I find that classes are simpler when you're just learning).

Of course, you can always apply styles to <tr>'s or <td>'s too.

You can then write a stylesheet that applies to each.

For example...

Code:

.table1 {
width: 400px;
border-width: 2px;
border-color: black;
border-style: solid;
background-color: #999999;
}
.table2 {
width: 200px;
border-width: 1px;
border-color: white;
border-style: solid;
background-color: #CCCCCC;
}

Or whatever you want your tables to look like.

For further information, I recommend the W3Schools Tutorials - they should be very helpful. Check out HTML (or XHTML, my preference) and definitely CSS. Go through the lessons and test things out!

Also, you don't need to keep declaring the font - if you declare Verdana as the font for <body>, it'll "cascade" (Cascade-ing Style Sheets) down through all the other elements, but those are things you'll learn eventually.

I would also recommend learning to code these things by hand - simply using a WYSIWYG editor like Dreamweaver raises the learning curve and creates so much more code than you need.

My old roommate used Dreamweaver and ended up making sites completely out of images with horrendous numbers of tables to fit them all together.

His six-page site was a couple MB - my (work in progress) 6 page site is like...50-100KB.

Good luck!

Oh, and - for the future - once you get (X)HTML and CSS down - I recommend dropping tables altogether as tools for layout - go with <div>'s and position them/lay them out with CSS, but that's for another day.

roto · 27-01-2005, 15:26

If you are a real noob, you may also want to know the difference between classes and ids...something methinks is simply clarified here:

http://css-discuss.incutio.com/?page=ClassesVsIds

flunky · 04-02-2005, 07:31

I have spent quite a while studying CSS for layout and my personal site is now purely driven by CSS ( here ). With CSS you don't need tables you can specify everything in your stylesheet (positioning, fonts, colours, borders, images etc). Below is a quick example from my site:

div#whatsnew {position: absolute; top: 460px; width: 516px; height: 110px; padding-left: 5px; padding-right: 5px; left: 110px; border: 1px solid #333333;}

Once you have your div id, in your html file simply put: "<div id=whatsnew></div>" and preview your html, a bordered box should appear on your page.

The good thing about CSS is you can over lap objects (pic on pic or txt on pic) without the clutter of tables and it will load a lot faster.

Corkscrew Mike · 13-02-2005, 11:39

Does anybody know how to have a fixed column width on Dreamweaver columns in tables?

Brown · 14-02-2005, 05:55

width="100px"

just make sure all your maths add up.

25-01-2005, 16:10	#1 (permalink)
jimbofoxman Registered User Join Date: Dec 2004 Location: Michigan Posts: 25	CSS and Tables? Ok, excuse this noobie question, but I am slowly picking this up. Basically I am tryin to setup a layout based on tables, but I want to give a small table inside that some different css values, like borders, colors, etc. Can I do this? And how.....? I tried adding table1 and table2 in the css file, but I can't seem to do anything with it in the html portion. Thanks Jim

27-01-2005, 15:26	#5 (permalink)
roto Floating libation anyone? Join Date: Apr 2003 Location: El Barco del Amor Posts: 4,642	If you are a real noob, you may also want to know the difference between classes and ids...something methinks is simply clarified here: http://css-discuss.incutio.com/?page=ClassesVsIds __________________ fun: HGC v.4 \| last.fm: DT \| me \| *oi! fck u roto: ...via meebo! New to interweb design?** Your friends at dt can help.

04-02-2005, 07:31	#6 (permalink)
flunky Established since 1977 Join Date: Dec 2004 Location: Lancashire Posts: 29	Why not just use pure CSS for layout? I have spent quite a while studying CSS for layout and my personal site is now purely driven by CSS ( here ). With CSS you don't need tables you can specify everything in your stylesheet (positioning, fonts, colours, borders, images etc). Below is a quick example from my site: div#whatsnew {position: absolute; top: 460px; width: 516px; height: 110px; padding-left: 5px; padding-right: 5px; left: 110px; border: 1px solid #333333;} Once you have your div id, in your html file simply put: "<div id=whatsnew></div>" and preview your html, a bordered box should appear on your page. The good thing about CSS is you can over lap objects (pic on pic or txt on pic) without the clutter of tables and it will load a lot faster.

13-02-2005, 11:39	#7 (permalink)
Corkscrew Mike Registered User Join Date: Jan 2005 Posts: 4	Fixed column width Does anybody know how to have a fixed column width on Dreamweaver columns in tables?

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search

25-01-2005, 17:35	#2 (permalink)
smallbeer I Ain't Losing Any Sleep™ Join Date: Apr 2003 Posts: 5,200	are table1/table1 classes/ids? i.e. .table1 { do something wondeful: now; }

25-01-2005, 18:02	#3 (permalink)
jimbofoxman Registered User Join Date: Dec 2004 Location: Michigan Posts: 25	The Body and Table1 were created through Dreamweavers CSS util. Well table1 was done as table and then changed to table1. Border info from Table1 was deleted in the interim while I was doin some more messin around. a.nav, a.nav:link, a.nav:visited { display:block; width:140px; height:20px; background:#000; border:1px solid #988d6b; margin-top:2px; text-indent:5px; text-align:left; text-decoration:none; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; color:#c7bb94; line-height:20px; overflow:hidden; } a.nav:hover {color:#c7bb94; background:#5d4d33;} a.nav:active { color:#000; background:#c7bb94; } body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #C7bb94; background-color: #000000; } table1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; line-height: 20px; color: #C7BB94; }h1 { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 14px; font-weight: bold; color: C7BB94; }

14-02-2005, 05:55	#8 (permalink)
Brown volkswagen yellow & gold Join Date: Apr 2003 Location: london, england. Posts: 6,147	width="100px" just make sure all your maths add up.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)