The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> table related problem with border added automatically...
rw1
post Sep 19 2006, 08:07 PM
Post #1


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



hello,

i am working on a joomla site and i have placed some 'modules' within some table cells. the problem is that for some reason there is a border around the modules and therefore the modules are not 'butting up' together.

i have placed a message on the joomla forums but i think it may just be a table related problem.

if anyone could check the link and offer any ideas it would be really appreciated.

thankyou.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
 
Reply to this topicStart new topic
Replies
pandy
post Sep 19 2006, 08:19 PM
Post #2


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

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



Do you mean the white stripe below the top image? Here goes.
http://www.htmlhelp.com/faq/html/images.html#image-nospace
Another way to get rid of the space is to use CSS and make the image 'display: block'.

I like that layout. It looks very nice and clean.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 12:31 AM
Post #3


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 20 2006, 11:19 AM) *

Do you mean the white stripe below the top image? Here goes.
http://www.htmlhelp.com/faq/html/images.html#image-nospace
Another way to get rid of the space is to use CSS and make the image 'display: block'.

I like that layout. It looks very nice and clean.


thank you pandy, i really appreciate your reply. could you tell me how to implement the "'display: block" solution. where and how do i need to add this?

thankyou.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 12:44 AM
Post #4


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

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



Have you fixed it already? I don't see gap anymore. blink.gif

Anyway, there is a whole table wrapped around the image and the table has a class so this should work.
.moduletable img { display: block }

But as the gap is gone I guess you don't need that.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 12:47 AM
Post #5


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 20 2006, 03:44 PM) *

Have you fixed it already? I don't see gap anymore. blink.gif

Anyway, there is a whole table wrapped around the image and the table has a class so this should work.
.moduletable img { display: block }

But as the gap is gone I guess you don't need that.


hi pandy,

no i have not fixed it, i still see it in ff. i would never not report on fixing something! smile.gif

so i add this to my css file:

.moduletable img { display: block }

what do i need to add where the image is? (btw its actually a flash movie)

thankyou.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 01:23 AM
Post #6


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

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



You don't have to change the HTML. But we are obviously talking about different stripes! The one I mean is in IE (and it's still there - I used the wrong browser when I said it wasn't). The thin, horizontal white line between the top image and the flash is much wider in IE than in FF. That's what I thought you meant.

But I see now that there's vertical stripe across the flash, on the left side, in FF. Is that what you mean? I'll have a look but I'm not so sure I can figure this one out.

Here's the line I mean in IE.
Attached Image

And the one I think you mean in FF. Is this the one?
Attached Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 01:34 AM
Post #7


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 20 2006, 04:23 PM) *

You don't have to change the HTML. But we are obviously talking about different stripes! The one I mean is in IE (and it's still there - I used the wrong browser when I said it wasn't). The thin, horizontal white line between the top image and the flash is much wider in IE than in FF. That's what I thought you meant.

But I see now that there's vertical stripe across the flash, on the left side, in FF. Is that what you mean? I'll have a look but I'm not so sure I can figure this one out.

Here's the line I mean in IE.


And the one I think you mean in FF. Is this the one?



thanks pandy, yes they are the lines i am talking about, i have removed the css references now and am just coming at the problem again with a clean slate. are you familiar with joomla?

basically there is an index.php which is the structure of the site (made of a table) and it calls 'modules' into various positions within the table. the modules contain flash movies. so i am guessing i need to apply a class to the table cell and then add that class to the css file. but i am not sure of the correct way to add these classes to the index.php and css file.

sorry to be one of these annoying time intensive problems!

This post has been edited by rw1: Sep 20 2006, 01:35 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 02:00 AM
Post #8


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

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



You want that first fix for IE anyway. But I've changed my mind. Add an id to the image tag (the top blue one), say id="logo". The use this in your CSS.
#logo { display: block }
I didn't notice at first that class="module table" is used all over the place, so that could possibly *beep* up.

I found the cause of your line too. It wasn't flash related as I feared. It's caused by HTML errors. Several table tags are missing. Especially a start tag for TABLE, the error at line 96 here.
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes
There's also a lot of peculiar widths for tables and TDs. 3200 pixels among others. You have to fix those things.

No, I haven't used Joomla, but I've seen its output before. Those guys sure like unnecessary tables. I don't envy you cleaning that up. mellow.gif

Just to prove it works and because I've just discovered how cool the attachment feature is. Look - no line! tongue.gif
Attached Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 05:42 AM
Post #9


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 20 2006, 05:00 PM) *

You want that first fix for IE anyway. But I've changed my mind. Add an id to the image tag (the top blue one), say id="logo". The use this in your CSS.
#logo { display: block }
I didn't notice at first that class="module table" is used all over the place, so that could possibly *beep* up.

I found the cause of your line too. It wasn't flash related as I feared. It's caused by HTML errors. Several table tags are missing. Especially a start tag for TABLE, the error at line 96 here.
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes
There's also a lot of peculiar widths for tables and TDs. 3200 pixels among others. You have to fix those things.

No, I haven't used Joomla, but I've seen its output before. Those guys sure like unnecessary tables. I don't envy you cleaning that up. mellow.gif

Just to prove it works and because I've just discovered how cool the attachment feature is. Look - no line! tongue.gif


hi pandy, thanks again, i'm still working on it...

i added the id to the top image - <img src="/images/stories/blue_header.png" id="logo" />

i added exactly this at the top of my css file - #logo { display: block }

and it hasnt changed anything...

can u tell me what you did to make that line go away?

thank you.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 06:24 AM
Post #10


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



i have cleaned up the code quite a lot, it is working in IE now (and i have applied ie/flash fix).

there is a still an unwanted little line in FF...if you could tell me how you got it away that would be great! thanks!

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 11:43 AM
Post #11


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

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



QUOTE(rw1 @ Sep 20 2006, 01:24 PM) *

i have cleaned up the code quite a lot, it is working in IE now (and i have applied ie/flash fix).

there is a still an unwanted little line in FF...if you could tell me how you got it away that would be great! thanks!


Not enough. There's still a missing </td> in the code for the nested tables that surround the flash (see the validator result for line number).

The page has changed though. This time fixing that wasn't enough. You have to remove those crazy widths too. I've deleted most of the widths and the page looks OK.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 07:11 PM
Post #12


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 21 2006, 02:43 AM) *

Not enough. There's still a missing </td> in the code for the nested tables that surround the flash (see the validator result for line number).

The page has changed though. This time fixing that wasn't enough. You have to remove those crazy widths too. I've deleted most of the widths and the page looks OK.


i cant figure out where to add it wacko.gif this is the entire code for my body area. can u tell me what is wrong with it? thank you.

CODE
<body class="page_bgr">
<div align="left"><table width="1002" border="0" cellpadding="0" cellspacing="0" class="frame">
    <!--DWLayoutTable-->
    <tr valign="top">
            <td width="1002" height="39" colspan="2" align="left" valign="top" class="header"><?php mosLoadModules ( 'header' ); ?></td>
          </tr>
    <tr>
      <td width="1002" align="center" valign="top" class="mainpage"><table width="1002" border="0" align="center" cellpadding="0" cellspacing="0"><tr><td width="198" rowspan="2" valign="top"><?php mosLoadModules ( 'left' ); ?></td><td width="802" height="104" valign="top"><?php mosLoadModules ( 'image' ); ?></td></tr><tr><td width="802" valign="top"><?php mosMainBody(); ?></td></tr></table></tr>
  </table><?php mosLoadModules ( 'booty' ); ?></div>
</body>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 09:13 PM
Post #13


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



i changed to this but now there is padding around the table cells wacko.gif

CODE
<body>
<table width="1002" border="0">
  <tr>
    <td height="39" colspan="2" valign="top" class="header"><?php mosLoadModules ( 'header' ); ?></td>
  </tr>
  <tr>
    <td width="198" rowspan="2" valign="top"><?php mosLoadModules ( 'left' ); ?></td>
    <td width="802" height="104" valign="top"><?php mosLoadModules ( 'image' ); ?></td>
  </tr>
  <tr>
    <td width="802" valign="top"><?php mosMainBody(); ?></td>
  </tr>
  <tr>
    <td colspan="2" valign="top"><?php mosLoadModules ( 'booty' ); ?></td>
  </tr>
</table>

</body>


This post has been edited by rw1: Sep 20 2006, 09:16 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 09:26 PM
Post #14


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



this is code now, i tried to make it cleaner and so there are no nested tables - the only problem now is that the lines have re-appeared:

(ps '1002' is the actual width of the template)

CODE
<table width="1002" border="0" cellspacing="0">
  <tr>
    <td height="39" colspan="2" valign="top" class="header"><?php mosLoadModules ( 'header' ); ?></td>
  </tr>
  <tr>
    <td width="198" rowspan="2" valign="top"><?php mosLoadModules ( 'left' ); ?></td>
    <td width="802" height="104" valign="top"><?php mosLoadModules ( 'image' ); ?></td>
  </tr>
  <tr>
    <td width="802" valign="top"><?php mosMainBody(); ?></td>
  </tr>
  <tr>
    <td colspan="2" valign="top"><?php mosLoadModules ( 'booty' ); ?></td>
  </tr>
</table>

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 09:33 PM
Post #15


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

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



QUOTE
(ps '1002' is the actual width of the template)

Remove it. rolleyes.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 09:40 PM
Post #16


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 21 2006, 12:33 PM) *

QUOTE
(ps '1002' is the actual width of the template)

Remove it. rolleyes.gif


i removed it and code now looks lihe this - the lines are still there wacko.gif

CODE
<table border="0" cellspacing="0">
  <tr>
    <td height="39" colspan="2" valign="top" class="header"><?php mosLoadModules ( 'header' ); ?></td>
  </tr>
  <tr>
    <td width="198" rowspan="2" valign="top"><?php mosLoadModules ( 'left' ); ?></td>
    <td width="802" height="104" valign="top"><?php mosLoadModules ( 'image' ); ?></td>
  </tr>
  <tr>
    <td width="802" valign="top"><?php mosMainBody(); ?></td>
  </tr>
  <tr>
    <td colspan="2" valign="top"><?php mosLoadModules ( 'booty' ); ?></td>
  </tr>
</table>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 09:50 PM
Post #17


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

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



Oh man... now the line is there in IE too. ohmy.gif

Here. I only made those changes I said.
http://web.telia.com/~u18115332/sayblu.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 10:02 PM
Post #18


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 21 2006, 12:50 PM) *

Oh man... now the line is there in IE too. ohmy.gif

Here. I only made those changes I said.
http://web.telia.com/~u18115332/sayblu.html


can u pm me exact code for index.php laugh.gif - i have tried what you said but it wont work. sorry!! blush.gif and if you go to sleep, i think i will go mad...
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 20 2006, 10:06 PM
Post #19


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



wait!! it worked!! ohmy.gif

edit: yes i just double checked! thank you VERY much. it would not have been possible without your patient support. thankyou!

This post has been edited by rw1: Sep 20 2006, 10:25 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 20 2006, 10:25 PM
Post #20


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

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



QUOTE(rw1 @ Sep 21 2006, 05:06 AM) *

wait!! it worked!! ohmy.gif


What? What did you do? huh.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
rw1
post Sep 21 2006, 12:04 AM
Post #21


Member
***

Group: Members
Posts: 41
Joined: 19-September 06
Member No.: 171



QUOTE(pandy @ Sep 21 2006, 01:25 PM) *

QUOTE(rw1 @ Sep 21 2006, 05:06 AM) *

wait!! it worked!! ohmy.gif


What? What did you do? huh.gif


i added the </td> where you said and removed all instances of width=1002

edit: from above - thank you VERY much. it would not have been possible without your patient support. thankyou!

This post has been edited by rw1: Sep 21 2006, 12:04 AM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Sep 21 2006, 12:09 AM
Post #22


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

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



Yes, but you first said it didn''t work. I saw the darn line too and I had emptied my cache. Had you forgotten to upload? dry.gif

No problem. You are welcome. I don't think I'll ever use Joomla though. happy.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic
rw1   table related problem with border added automatically...   Sep 19 2006, 08:07 PM
pandy   Do you mean the white stripe below the top image? ...   Sep 19 2006, 08:19 PM
rw1   Do you mean the white stripe below the top image?...   Sep 20 2006, 12:31 AM
pandy   Have you fixed it already? I don't see gap any...   Sep 20 2006, 12:44 AM
rw1   Have you fixed it already? I don't see gap an...   Sep 20 2006, 12:47 AM
pandy   You don't have to change the HTML. But we are ...   Sep 20 2006, 01:23 AM
rw1   You don't have to change the HTML. But we are...   Sep 20 2006, 01:34 AM
pandy   You want that first fix for IE anyway. But I'v...   Sep 20 2006, 02:00 AM
rw1   You want that first fix for IE anyway. But I...   Sep 20 2006, 05:42 AM
rw1   i have cleaned up the code quite a lot, it is work...   Sep 20 2006, 06:24 AM
pandy   i have cleaned up the code quite a lot, it is wor...   Sep 20 2006, 11:43 AM
rw1   Not enough. There's still a missing </td...   Sep 20 2006, 07:11 PM
pandy   Look at the validator result here. http://www.html...   Sep 20 2006, 09:12 PM
rw1   i changed to this but now there is padding around ...   Sep 20 2006, 09:13 PM
rw1   this is code now, i tried to make it cleaner and s...   Sep 20 2006, 09:26 PM
pandy   Remove it. :rolleyes:   Sep 20 2006, 09:33 PM
rw1   Remove it. :rolleyes: i removed it and code n...   Sep 20 2006, 09:40 PM
pandy   Oh man... now the line is there in IE too. :o H...   Sep 20 2006, 09:50 PM
rw1   Oh man... now the line is there in IE too. :o ...   Sep 20 2006, 10:02 PM
rw1   wait!! it worked!! :o edit: yes ...   Sep 20 2006, 10:06 PM
pandy   wait!! it worked!! :o What? Wha...   Sep 20 2006, 10:25 PM
rw1   wait!! it worked!! :o What? Wh...   Sep 21 2006, 12:04 AM
pandy   Yes, but you first said it didn''t work. I...   Sep 21 2006, 12:09 AM
pandy   You have it there... View source. Maybe you have o...   Sep 20 2006, 10:24 PM
pandy   [quote name='pandy' post='1574' date='Sep 20 2006...   Sep 20 2006, 11:03 AM


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: 28th March 2024 - 03:48 AM