Problems with SSI and CSS

Steve Jackson · Steve Jackson

I am building a web site that for every page I am wanting to add links
to 2 external CSS files held in a styles folder. One CSS file is for
the main part of the text (main.css) and the other for the leftside
linkbar (linkbar.css). The link bar will be a complete ssi file
(linkbar2.ssi) that consists of 1 table (1 column and 2 rows). I am
having problems when I add both css files to my page and also add the
ssi linkbar. I am only having problems with activating the linkbar css
file while the main css file seems to work ok. Both stylesheets need
to render text in the same table - the linkbar in the first column and
the main text in the middle column. Even if I try to ensure it renders
the first column in the <td> tag for the linkbar and the 2nd <td> tag
for the main text it seems to render all of the page as the "main" css
file and does not independently render the "linkbar" differently.

If I add the linkbar ssi file to another part of the page and then
action the linkbar stlyesheet in the same way it still does not work.
However if I action the linkbar css file to part of the page which I
have created in the page itself (i.e: I have not linked a ssi file)
then it works fine.

Is there a problem with css and ssi that I am not aware of? Even when
I upload to a test server it still renders it incorrectly. Should I be
making the files document or site root relative? Should I have the ssi
files directed as a file or virtual? Will any of these things make a
difference?

I have put the test page onto a folder on another server of a web site
I have created, which can be found at:
[url]http://www.risedale.co.uk/greyfriars/fixtures.shtml[/url]

While it looks ok the linkbar text should be 10px while the main text
should be 12px. The linkbar text renders the same as the main text.
The strange thing is I have the same setup of css and ssi actions in
the main website at [url]http://www.risedale.co.uk/[/url]

Any help would be grately appreciated
Many Thanks
Steve

The page code I am having problems with is:

<link href="/greyfriars/styles/leftbar.css" rel="stylesheet"
type="text/css">
<link href="/greyfriars/styles/main.css" rel="stylesheet"
type="text/css">
</head>

<body bgcolor="#FBED46" leftmargin="0" topmargin="0">

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="107" class="leftbar">

</td>
<td align="left" valign="top"><img
src="/greyfriars/images/sections/fixtures.jpg" width="250"
height="86"><br>
<table width="100%" border="0" cellpadding="5" cellspacing="0"
class="main">
<tr>
<td valign="top"><p>The fixtures for this season are: </p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
</td>
</tr>
</table></td>
<td width="100"> </td>
</tr>
</table>

While the code for the ssi file for the linkbar is:

<table width="107" border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="left" valign="top"
background="/greyfriars/images/main/leftbar.jpg" >
<p><img src="/greyfriars/images/main/features.jpg"
width="100" height="20">
<a href="#">Latest News</a><br>
<a href="#">The Main Feature</a><br>
<a href="#">What The Papers Say</a><br>
<a href="#">Soccerbabe of The Week</a></p>
<p><img src="/greyfriars/images/main/matchday.jpg"
width="100" height="20">
<a href="#">Fixtures</a><br>
<a href="#">Results/Stats</a><br>
<a href="#">League Table</a><br>
<a href="#">Match Reports<br>
<br>
</a><img src="/greyfriars/images/main/players.jpg"
width="100" height="20">
<a href="#">Player Profiles</a><br>
<a href="#">Featured Player<br>
<br>
</a><img src="/greyfriars/images/main/ourclub.jpg"
width="100" height="20">
<a href="#">Club History</a><br>
<a href="#">Acheivements</a><br>
<a href="#">Find Us</a><br>
<a href="#">Club Shop</a><br>
<a href="#">Contact Us</a>
</tr>
<tr>
<td height="15" align="left" valign="top"><img
src="/greyfriars/images/main/bottomleftbar.jpg" width="107"
height="15"></td>
</tr>
</table>

Steve Jackson · Steve Jackson

Ok, to simplify matters:
I am trying to make sure that my linkbar will have link, visited,
hover and active rules that will be different to that of the main body
of the text. Linkbar having 10px while the main body of the page to
have 12px. Seems as though the problem is contained in 2 areas:
1. There are 2 external stylesheets that clash and 1 overruns the
other.
2. Any .ssi that has text will always have the attributes of one of
the stylesheets and remain the same, even if I add the styleheet
properties to the column the .ssi file is contained in. It seems as
though the ssi file will always have the first stylesheet attributes
no matter what.

Any advise on how having 2 different font sizes for linked, visited,
hover, active states can be achieved on the same page either by
modifying what I have done or taking another approach to the problem.

Many Thanks
Steve Jackson

Problems with SSI and CSS

Thread Tools

Display

Problems with SSI and CSS

Similar Questions and Discussions

problems with 8.0 Rc4

problems with preLoadNetThing and fileName (was problems with preLoadNetThing and importFileInto)

IE6 problems

I having problems with IIS

Why am I Having Problems ?

Re: Problems with SSI and CSS

Posting Permissions