Solved

CSS not working across tabled content

Posted on 2003-12-08
28
294 Views
Last Modified: 2010-04-09
I'm trying to get a style sheet working on some text in a tables cell. Applying it in dreamweaver displays fine, but previewing in a browser doesn't.
The URL is :  

http://members.lycos.co.uk/crayzer/thegallery/home.htm

if anyone can help me it'd be VERY much appreciated. I don't know much about the coding side of it... wich is probably why I'm having this problem. but I can modify it IF I know what's wrong. Works fine on the about.htm page, but I just can't figue it out.

Thanks in advance.... Mark
0
Comment
Question by:creyzo
  • 16
  • 9
28 Comments
 
LVL 1

Expert Comment

by:Rayni
ID: 9898593
If you are using frames it will not cross over to the other frames but only apply to the html in the current frame file. You would have to play the CSS code in ever file.
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9898738
3 issues here:

1. The link to your stylesheet doesn't seem to exist on the site, so the styles aren't being applied. about.htm works because you have an internal stylesheet defined in the page. Also, notice that I've added a line-height spec, which will tighten it up a bit.

<style type="text/css">
<!--
.style4 {color: #53B0DB}
.titles {
      font-size: 8pt;
      font-weight: bold;
      font-family: Verdana, Arial, Helvetica, sans-serif;
      line-height:13px;
      color: #EAEAEA;
}
.bodytext {
      font-family: Verdana, Arial, Helvetica, sans-serif;
      font-size: 8pt;
      color: #EAEAEA;
}
-->
</style>


2. There's simply too much text to fit into that grey area. You need to shorten it up a little:

<div align="justify">
    <p class="titles"><br>
    Welcome to thegallery.com<br><br>
    We are based in the West Midlands, and are dedicated to showcasing new artistic talent from around the UK . Each month we will be bringing you new exhibits from the freshest talent, with art ranging from traditional methods to the latest digital creations.<br><br>
    To view this months major exhibits, click on the links to the right. The work of these artists is available to buy, whether you want to commission one of our artists or simply  buy a print.<br><br>
    We hope you enjoy your visit to <strong>thegallery.com</strong>
    </div>

3. You have an extra semi-colon at the end here - you should remove it.
<td width="177" height="362" align="left" valign="top" background="images/textbg.gif" ;>

That should probably cover it for now...

0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9898770
Just to add:

font-size: 8pt;

This should be specified in pixels if you need an exact size. Points are really only meant for print media.

font-size: 11px; is a functional equivalent.
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9898796
>>The link to your stylesheet doesn't seem to exist on the site

I should clarify that. The file is there on the site - but it's an empty document...
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9898857
One last thing :-)

I'm not crazy about how the welcome text is beign justified in the cell (the word "to" is pushed to the right.) You may be better off beginning the text justification after the welcome line, like this:

<td width="177" height="362" align="left" valign="top" background="images/textbg.gif" style="padding-top:5px;">
<p class="titles">Welcome to thegallery.com</p>
<p class="titles" style="text-align:justify;">We are based in the West Midlands, and are dedicated to showcasing new artistic talent from around the UK . Each month we will be bringing you new exhibits from the freshest talent, with art ranging from traditional methods to the latest digital creations.<br><br>
To view this months major exhibits, click on the links to the right. The work of these artists is available to buy, whether you want to commission one of our artists or simply buy a print.<br><br>
We hope you enjoy your visit to <strong>thegallery.com</strong></p>
</td>
0
 

Author Comment

by:creyzo
ID: 9900410
yeah, I left justified the welcome text, and managed to sort the code. The text was only  causing problems with the tables design because it wasn't setting to 8 pt. But I've got it sorted now, just added the css info at the top.

I think it's probably a good idea to start coding the pages my self, I always seem to have probs when using tables and dreamweaver.

Thanks for the help, and that line height thing is very handy! Didn't even realise you could do that.

It's all sorted now, I just need to make your code adjustments. Thanks for the help, I've been on this site like 3 days and it's more helpfull than I ever imagined it would be

A big thanks to everyone who helped.
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9900440
You're welcome - and I'm glad you're finding the site so useful. As you said, sometimes it's just a matter of another pair of eyes! :-)
0
 

Author Comment

by:creyzo
ID: 9904012
one last question, if you look at the midlands page (http://members.lycos.co.uk/crayzer/thegalley/midlands.htm), the 3 pics are in a cell. Under this I need to have 3 coloumns have text... but I can't split this cell into 3 columns because I can't get them spaced as I need. Don't know why, but it won't let me do it. Is there anyway of setting the text properties using style sheets or something similar?

And more importantly, why can I not the split the cell into 3 even columns?! Tables drive me insane! Especially when you need differenet layouts for each page.

Thanks again.

Mark
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904053
I'm getting a Page Not Found...
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904069
Okay - found it on the site... hold on...
0
 

Author Comment

by:creyzo
ID: 9904073
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904092
Can you post the code that you have for those three cells? It would be easier that way...
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904110
I assume you need these cells to go in the white area below, yes?
0
Better Security Awareness With Threat Intelligence

See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

 

Author Comment

by:creyzo
ID: 9904118
just the mid three cells?
0
 

Author Comment

by:creyzo
ID: 9904138
the cell that the three preview pics are in has the bottom section of the cell empty. I need to add three sections of text that are in line with the pics (so it looks like they're in 3 columns).

All this needs to be in the main cell containing the 3 pics.

But whenever I try to add a colomn, it screw up the rest of the cells and I can't split the cell in 3 even columns. which section of code do you need?
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904139
I just need to be sure I understand your question:

>>Under this I need to have 3 coloumns have text... but I can't split this cell into 3 columns because I can't get them spaced as I need.

Do you mean that if you put the three mouseover images into separate cells they don't line up?
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904144
We're cross-posting. Hold on a moment.
0
 

Author Comment

by:creyzo
ID: 9904154
kindof. Not too good at explaining this am i ;(
 Basically the 3 pics are in 1 cell at the minute. All I need to do is split this cell iinto 3, so I can put each image at the top, with some text underneath. But I can't seem to split the cell withouth scrwing up the rest of the table.
0
 
LVL 31

Accepted Solution

by:
seanpowell earned 500 total points
ID: 9904183
I think this is what you're after:

    <td colspan="2" align="left" valign="top" background="/images/aboutbgbottomright.gif">
    <table border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td><a href="andrewjsmith.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image1','','images/andrewjsmith-region-on.gif',1)"><img src="images/andrewjsmith-region.gif" name="image1" width="185" height="168" border="0"></a></td>
        <td><a href="jamielowe.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image2','','images/jamielowe-region-on.gif',1)"><img src="images/jamielowe-region.gif" name="image2" width="158" height="168" border="0"></a></td>
        <td><a href="kultdesigns.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('image3','','images/kultdesigns-region-on.gif',1)"><img src="images/kultdesigns-region.gif" name="image3" width="168" height="168" border="0"></a></td>
      </tr>
      <tr>
        <td style="padding-left:30px;">Text for column 1</td>
        <td style="padding-left:4px;">Text for column 2</td>
        <td style="padding-left:4px;">Text for column 3</td>
      </tr>      
    </table></td>
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904205
NOTE:

I wouldn't use this:
<td colspan="2" align="left" valign="top" background="/images/aboutbgbottomright.gif">

because it's just a solid color - and so doesn't require an image. Use this instead:

<td colspan="2" align="left" valign="top" bgcolor="#D2D2D2">
0
 

Author Comment

by:creyzo
ID: 9904234
damn, that's eaxactly what I needed! Quick thinker!!!

So if you can split tables up like this, why doesn't it work when you use the cell/table options from dreamweavers menus?
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904415
Probably because I created a nested table to go into the single cell.

If you were to simply increase the number of cells for the main cell, than you need to also increase the colspan for all the other rows as well. That's probably confusing - but when the table code gets complex - dreamweaver may not understand what's going on when you start adding cells.
0
 

Author Comment

by:creyzo
ID: 9904552
thanks, I think I get what you mean. I'm going to have to study up on html over the next few weeks. I always rely on Dreamweaver for everything.

One quick and LAST question though

You answered these so quickly! Are you employed by EE, or are you just a forum member. I'm shocked by how quickly you answered, and to come up with code. It's pure madness... but very much appreciated;)
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904572
No, the experts here are all volunteers, working for nothing.
Actually I'm an Owner and Creative Director of a web design agency in Toronto, Canada. If you click on my member name, it's all there.
0
 

Author Comment

by:creyzo
ID: 9904593
damn, well thanks again then. You've helped me massively! If you're ever over Birmingham UK way... I owe you a few drinks!

Cheers mate.

Mark
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9904611
Grew up in London - not sure what the hell I'm doing over here.
Always nice to talk to someone from home...
0

Featured Post

Why You Should Analyze Threat Actor TTPs

After years of analyzing threat actor behavior, it’s become clear that at any given time there are specific tactics, techniques, and procedures (TTPs) that are particularly prevalent. By analyzing and understanding these TTPs, you can dramatically enhance your security program.

Join & Write a Comment

Suggested Solutions

Title # Comments Views Activity
Zoom web page in asp.net 2 35
Why can't my site show videos? 5 41
CSS grid style change 2 14
Change month dropdown 5 15
Popularity Can Be Measured Sometimes we deal with questions of popularity, and we need a way to collect opinions from our clients.  This article shows a simple teaching example of how we might elect a favorite color by letting our clients vote for …
Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
The viewer will learn how to create a basic form using some HTML5 and PHP for later processing. Set up your basic HTML file. Open your form tag and set the method and action attributes.: (CODE) Set up your first few inputs one for the name and …

708 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now