What's causing white border?

HTML & CSS
1

Hi guys,

Can anyone help me please? I’m designing a template for a Joomla CMS site and some of my headings have a white border around them and I can’t see where it’s coming from so I can remove it.

If you take a look at this link http://c9926560.myzen.co.uk/

You’ll see that around ‘Welcome’ there is some white space - only a pixel or two. I want to remove this. Any ideas?

ALso, once that’s sorted. I’ll want to force the grey background colour to extend to the full with of the section. How might I force that please?

Thanks

O.

2

Try something like this:

<table class=“contentpaneopen” cellspacing=“0” cellpadding=“0”>

To get the gray bg, just do what you did in the next table below, using something like <p> or heading with a gray background.

3

Thanks Ralph.

Trouble is I can’t add those properties to the <table> tag without messing with the core CMS code which I’d rather not do. I was hoping I could affect it with just the CSS.

With regards to the grey background, the one below works because I have inserted a <h3> tag into the article itself, which is fine if I have to do that, however it makes it harder for the end client as they have to remember to add that for the title. The ‘Welcome’ text is the actual article title. Joomla inserts it into it’s own table it seems.

Is there a way to force the table to fill the width with just the CSS?

4

Ah, it seems a simple width:100% fixed the grey background

5

OK, try this in the CSS to address the white border:

.contentpaneopen {border-collapse:collapse;}

I should have said that before. Sorry!

6

Thanks Ralph - that seemed to do the trick.

Is that likely to work for all browsers?

7

Yes, should do. It’s very standard CSS. :slight_smile: (I just had a brain fade by not suggesting it first up.)

8

Much appreciated!