By W.M. on

I have created a table inside a node. The table is fine but there is a strange thin line at the top of the table. It's a gray thin line. Is there a way to remove it?!

⋅ Categories: Drupal 6.x

Comments

kjv1611’s picture

kjv1611 commented

Have you tried changing the theme to see if that makes a difference? Also, you may can edit the theme settings (global or theme-specific) to remove the line... perhaps there's a setting related to that for tables?

W.M.’s picture

W.M. commented

It looks like the problem is theme independent. I still see the line after changing the theme. Which files I need to verify?!

zoo’s picture

zoo commented

Hi Gear,

Drupal loads a lot of css files beyond your theme css'. And (as you know) you need to find the css rule which is causing that gray line.

To do this you may want to use some very powerful Firefox add-ons as "Firebug" or "Web Developer".

They will help you to narrow down all the style rules referring to an html element, even if they were part of Drupal core files.

zoo’s picture

zoo commented

Hi Geir19,

I'm using this Drupal module to get rid of all those "hidden" styles (works with Firefox):

To get the module installed and working please do the following things:

1. Download and install the module.
2. Set the appropriate permissions for user's to see debugging information. By default only UID 1 can see anything.
3. Make sure that your theme is outputting the $closure variable. Most themes do, but some do not (and should).
4. Download the latest version of the Firefox plugin (see links above) and make sure its enabled.

Should help you to find that "line"!

Bye

Zoo

Well’s picture

Well commented

I had such problem in Bluemarine. Are you using this theme?

You need to paste some text in style.css:

tbody {
border-top: 0px solid #ccc;
}

And then clean a site's cache.

In the system.css you can see table border's parametres. This problem because of them.

drupalb’s picture

drupalb commented

FYI:
"Well" (above) has solved this problem for me, and I am using the Deco theme.
I added the css to my style.css document and it was fixed.

webengr’s picture

webengr commented

yep,

thanks for this thread.

I was modifying "clean" theme
and had a weird line above tables...

that css fix in clean's css/htmlelements.css
adding

/* http://drupal.org/node/554632 */
/* maybe system.css puts thin line on top tables */
tbody {
border-top: 0px solid #ccc;
}

got rid of that line.

ashu12’s picture

ashu12 commented

this post is very very useful for everyone.

Raf’s picture

Raf commented

Seen that line a ton of times too. By default, Drupal adds "border-collapse: collapse" to tables. I fix this by adding this in my CSS:

table {
  border-collapse: separate;
}
rolodmonkey’s picture

rolodmonkey commented

I wrote an article about this years ago:

http://irolo.net/drupal_firefox_and_the_mysterious_grey_line

--

Read more at iRolo.net

oo7_golden_1’s picture

oo7_golden_1 commented

This is exactly what I needed to know. Thank you guys it was very helpful. Was a little confused when I saw this line above my table even after going through multiple themes, it was hard to spot with firebug too so thank you guys, I was able to add

tbody {
border-top: 0px solid #ccc;
}

To my custom CSS file and now it’s beautiful. Thanks again.