Still Trying to Get CSS Working

[carfac]

Hi:

Sorry- I am really trying hard to learn CSS, but sometimes I just bang my head. I am updating a few pre-made templates to fit our style- so there was a pre-existing CSS sheet I am working into. Anyway, I have two problems right now that I cannot seem to solve. Hopefully, you can tell me what to do, or perhaps where to look to get these fixed!

1) I set up a style like:

.link6 {
text-align:left;
font-size:x-small;
display:inline;
}

but this does not seem to effect the sixe of a link font within this tag- here is page code:

<span class="link6"><a HREF="http://my.domain.com/page1.html">Page 1</a><br>
<a HREF="http://my.domain.com/page2.html">Page 2</a><br>
</SPAN>

Basically, the page is ignoring the font size...

Problem 2.

I have a table that has to rows, the bottom one of which has images that look like "tabs" on the page. Since the page and "tabs" is white, and the table is blue, the tabs MUST align bottom fully (as well as left) Here is simplified page coe- TR 1 is the logo, TR 2 should be the tabs, some of which link to other pages...

<table CLASS="banner" style="padding-bottom:0;width=100%">
<tr>
<td>
<center><a HREF="http://mysite.com/"><img SRC="/mysite/logo.gif" ALT="blah" WIDTH=400 HEIGHT=59 BORDER=0></a></center>
</td>
</tr>
<tr>
<td class="button">
<img border="0" src="http://mysite.com//menu_space.gif" width="15" height="20" ALT="blah">
<img border="0" src="http://mysite.com//menu_main_h.gif" width="104" height="17" ALT="blah">
<a HREF="http://mysite.com/page.html"><img border="0" src="http://mysite.com/menu_syn_b.gif" width="104" height="17" ALT="blah"></a>
</td>
</tr>
</table>

Here is "button"

.button {
width:100%;
align:left;
vertical-align:bottom;
border-width:0;
margin: 0 0 0em 0em;
position:relative;
left:-10px;
top:3px;
}

See that "position:relative" bit? That arraignes things fine for IE, but does NOT work for Netscape or Firefox. Wuold like to to work good everywhere.

Any ideas?

Thanks!

Dave

[Longhaired Genius]

This is not what you will want to hear but trying to re-create an existing design with css is a job for someone who knows css inside out. To take this on as an initial project is a recipe for heartache (as you know). In my opinion, the only viable way to learn css is to start with a blank page and gradually discover its advantages and limitations. Just looking at the markup you've posted tells me this is not a task for a Saturday night, and it looks like others feel the same way. An expert will make short work of what you want to do and tell you what's impossible, get one on board in an official capacity.

[carfac]

I hear you... unfortunately, starting from blank is not an option. This is an existing program, sort of like buying a forum, that then must be modified to work in my style. To be honest, the existing site is bult from the same program, with some CSS in it. The program has been wholely overhauled by the software company, and is now all CSS. Perhaps I need to find a local CSS expert....

dave

[J64sqs]

you need to specify that it is an anchor (link).

so write...

.link6 a {text-align:left;
font-size:x-small;
display:inline;}

[J64sqs]

Please disregard my last post.

[carfac]

OK, got the anchor text working- thanks!

On the other- the "button" thing, if I call that from TD (<TD Class="button">), it works in IE, but not netscape. If I call it in SPAN or P (<P CLASS='button">) it works in Netscape, but not IE...

Thansk!

[J64sqs]

I had doubts about my suggestion about the link problem, but I'm glad you got it working.

About your other question...

There is no "align" in css. It is "text-align" (no matter if it is text or images or whatever). So, it should look like...

.button {text-align:left;}

I'm not sure "vertical-align" exists for css. But you can try putting "valign=bottom" in your <td>, like this...

<td class="button" valign="bottom">

[createErrorMsg]

not sure "vertical-align" exists for css

It does, but people's expectations of it rarely match up with it's actual use. I think it will do what carfac wants in this case, as it applies only to the line-boxes in inline elements and (I believe) table cells.

<TD Class="button">), it works in IE, but not netscape. If I call it in SPAN or P (<P CLASS='button">

There's a typo in both of those. In the TD, you've capitalized the beginning C. In the SPAN you've opened with a single-quote and closed with a double. They should both be...

<td class="button">
<span class="button">

I realize this could just be an error in the post and not in the original code, but it's worth double checking. Problems like this are usually the result of some little slip up that some browsers forgive and others don't. Running the code through the validator [validator.w3.org] can help identify these sorts of problems.

cEM