The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Tables and such
exentrix.
post Apr 22 2007, 12:44 PM
Post #1


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



Hey there, i've been slowly coding this layout and i was wondering if someone could help me with some HTML issues.
Here's the link:

http://1312.nytka.org/layout/index2.php

In particular I could use help with adding 'cell padding' to the content areas. The problem with doing this is that on the 'Featured Article' section i need 0 cell padding, where as on other cells/rows in the table '5' would be good.
The question is, is there anyway to change the padding on individual cells within a table?

Any other suggestions are welcome. smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2007, 02:36 PM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Yes, with CSS. CSS lets you control padding and borders of each cell individually.
http://htmlhelp.com/reference/css/
http://htmlhelp.com/reference/css/box/padding.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
exentrix.
post Apr 22 2007, 02:55 PM
Post #3


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



That looks like what i'm looking for.
How would i go about using that on the page i showed?
I've never really used CSS before.. looks complicated.

Guess i'm gonna have to start reading some tutorials.

Thanks for your help.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2007, 03:16 PM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



It isn't complicated, really. Not for simple things like this. Read the introductory chapters in the reference and you'll soon get the hang of it. You'd have to give the concerened TDs a class.

CODE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>

<head>
<title>CSS borders</title>

<style type="text/css">
<!--
td      { width: 8em; height: 8em;
          border: 1px solid gray }
.foo    { border-style: solid dashed dotted double;
          border-color: yellow red blue green;
          border-width: 10px 5px 15px 20px }
-->
</style>

</head>


<body>

<table>
   <tr>
       <td>
       Bla bla bla
       </td>
       <td class="foo">
       Bla bla bla
       </td>
       <td>
       Bla bla bla
       </td>
   </tr>
</table>

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
exentrix.
post Apr 23 2007, 10:21 AM
Post #5


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



That's a lot of help, thanks a lot.

This post has been edited by exentrix.: Apr 23 2007, 10:52 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 23 2007, 07:23 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



You are welcome a lot. smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
exentrix.
post Apr 24 2007, 10:33 AM
Post #7


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



=D

I know it's a bit unnecessary, but is it possible to apply more than 1 'class' to a tag (for example the <TD> tags).
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 24 2007, 11:15 AM
Post #8


.
********

Group: WDG Moderators
Posts: 9,653
Joined: 10-August 06
Member No.: 7



QUOTE(exentrix. @ Apr 24 2007, 05:33 PM) *

is it possible to apply more than 1 'class' to a tag (for example the <TD> tags).

Sure. You can use it like this:

CODE
p {color: black; background: white;}
p.foo {color: green;}
p.bar {background: red;}

<p class="foo">this should be green text on white background</p>
<p class="bar">this should be black text on red background</p>
<p class="foo bar">this should be green text on red background</p>

or like this (note the IE6 bug, don't know about IE7):

CODE
p {color: green;}
p.foo.bar {color: red;}

<p class="foo">this should be green</p>
<p class="bar">this should be green, but IE6 makes it red</p>
<p class="foo bar">this should be red</p>

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
exentrix.
post Apr 24 2007, 02:39 PM
Post #9


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



That's pretty useful. Thank you, kind sir. biggrin.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 24 2007, 04:59 PM
Post #10


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Sooner or later you'll want to read about the CSS table model.
http://www.w3.org/TR/CSS2/tables.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
exentrix.
post Apr 28 2007, 05:54 AM
Post #11


Novice
**

Group: Members
Posts: 23
Joined: 22-April 07
Member No.: 2,596



CSS is pretty amazing.

Thanks for that link, it might come in useful one day.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 18th April 2024 - 08:31 PM