close ad
 
Important WebAssist Announcement
open ad
View Menu

Technical Support Forums

Free, outstanding support from WebAssist and your colleagues

 
› WebAssist Forums › General / Announcements › CSS › Simple CSS question?
Sign in to rate this thread
rating

Simple CSS question?

Thread began 10/03/2011 1:00 am by andrewjeny09430904 | Last modified 3/06/2012 1:51 am by tkristy85430726 | 2111 views | 3 replies |

10/03/2011 1:00 am  |  #1 andrewjeny09430904

Simple CSS question?

I have a table with 61 rows and 4 columns. Names, email, phone,
affiliation.

I want to have a solid 1px bottom border for each row. But I am not
smart enough with CSS to figure out how to do this without giving a
class to each TD (there are 244 of them) And I want there to be about
8px of margin underneath that border, or before the next person's name.

How could I do this? I just want a bottom border. I've tried giving the
<tr> a class that has a border-bottom assigned to it, but haven't been
able to make it work.

Thanks!

ecommerce web development seo services

Sign in to reply to this post

10/03/2011 5:12 am  |  #2 gruant2000381341

a few different ways to do this, one way is if your table is inside of a div you could target that div's td and th like this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#wrapper td, th {border-bottom: 1px solid black !important;}
</style>

</head>

<body>
<div id="wrapper">
<table width="200">
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
</table>
</div>
</body>
</html>

Sign in to reply to this post

10/03/2011 5:19 am  |  #3 gruant2000381341

or here would be another way

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
table {border-collapse: collapse;}
tr {border: 1px solid #666;}
</style>
</head>

<body>

<table width="200">
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
</tr>
</table>

</body>
</html>

Sign in to reply to this post

3/06/2012 1:51 am  |  #4 tkristy85430726

Difference between HTML and CSS?

The HTML and CSS part is essentially art. HTML is the language that you use to add content like paragraphs, tables, headers, horizontal bars, images, and lots more. CSS is the style coding that is used to make the web page look the way you want in a browser.CSS is cascade style sheets. It's a complement for html.


web development services

Sign in to reply to this post

Build websites with a little help from your friends

Your friends over here at WebAssist! These Dreamweaver extensions will assist you in building unlimited, custom websites.

Build websites from already-built web applications

These out-of-the-box solutions provide you proven, tested applications that can be up and running now.  Build a store, a gallery, or a web-based email solution.

Want your website pre-built and hosted?

Everything else!

Close Windowclose

Rate your experience or provide feedback on this page

Account or customer service questions?
Please user our contact form.

Need technical support?
Please visit support to ask a question

Content

rating

Layout

rating

Ease of use

rating

security code refresh image

We do not respond to comments submitted from this page directly, but we do read and analyze any feedback and will use it to help make your experience better in the future.

go to page top
Close Windowclose

We were unable to retrieve the attached file

Close Windowclose

Attach and remove files

add attachmentAdd attachment
Close Windowclose

Enter the URL you would like to link to in your post

Close Windowclose

This is how you use right click RTF editing

Enable right click RTF editing option allows you to add html markup into your tutorial such as images, bulleted lists, files and more...

-- click to close --

Uploading file...