CSS - Two Seperate Css Files

Does Tomcat server supports CSS (Cascading Style Sheets) files.
In my application on JSP, Tomcat does not support it.
wainting for your responses.
thanx in advance

Possible?

I know that there have been a few posts on this in the past but none seem to specifically cover what I am after.

I am currently creating a CMS for a few sites that I run. Now don't get me wrong this is nothing flashy, it's just a personal project, however, when designing pages I can get everything to display in FF, Opera and IE perfectly well, however, as I add new elementes to the page things seem to get a little.. out of place.

My pages always display perfectly well in FF and Opera, however, IE 6 & IE 7 usually have small problems to do with margins and such, nothing life changing but I am very critical of my own work.

My question is whether or not I should create seperate style sheets for IE6 & IE7 that overwrite certain bits of the CSS that IE doesnt like and replace it with code that works well in IE, whilst hiding it from other browsers.

I would also be interested if people have other suggestions with regard to this as I am always up for learning new skills and ways of doing things.

Thanks for reading!

Regards, Matt.

I am trying to use the IE workaround for PNG transparency (using the alpha filter).

The trouble is it only seems to work on a fixed size image. Is there any way to successfully apply it to a repeating background? I can't seem to find any info on that so I am guessing it can't be done

How can I fit the following into a CSS file (external stylesheet)?

Code:

<div id=Canterbury style="position:absolute; width: 200px; height: 52px; z-index: 1; visibility: hidden"><table 

border="0" cellspacing="0" cellpadding="0"><tr><td bgcolor="#FFB928"><!-- border colour --><table border=0 

cellpadding=1 cellspacing=1>

<tr id="Canterbury1" bgcolor="#FFD784"><td><a class=menu href="#" onMouseOut="menuOut('rollimg2'),setBgColor(

'Canterbury1','#FFD784')" onMouseOver="menuOver('rollimg2'),setBgColor('Canterbury1','#990000')" target=

_top><img src="rp.gif" border="0"> BBC Radio Kent</a></td></tr>

<tr id="Canterbury2" bgcolor="#FFD784"><td><a class=menu href="mms://ms1.capitalinteractive.co.uk/invicta_low" 

onMouseOut="
menuOut('rollimg2'),setBgColor('Canterbury2','#FFD784')" onMouseOver="menuOver('rollimg2'),setBgColor(

'Canterbury2','#990000')" target=_top><img src="wmp.gif" border="0"> Invicta FM</a></td></tr>

</table></td></tr></table></div>

I have a few other placenames as well, as you can see from www.radiofeeds.co.uk/maptest/csstest.html, but there are a few ids where I'd like to exclude these settings from.

I know I can set the whole of the Canterbury block with:

div#Canterbury,div#<any other placeneames>
{
position:absolute; width: 200px; height: 52px; z-index: 1; visibility: hidden
}

But how can I also have the border colour (<td bgcolor="#FFB928">), bgcolor, onMouseOut and onMouseOver properties put into the CSS file?

Please can I have the code for the CSS file and for the replacement code that goes back into the page.
I'd like this to be efficient as possible.

I cant work out how to comment my css files

Can anyone tell me? Also - anyone got any views on the best way to structure a CSS file?

I finally got the alpha loader to work.. and, my transparent PNG files work great as a background in IE - I even have a page that loads many links for using Lightbox.. and, it works great.

But.. now.. in Firefox and Safari.. I don't have a background.. it is crystal clear.. *Gulp*

Can anybody help me?

Dear sir
I have faced one problem, actually before uploading any file there should be scanning, but how to do that scanning? is there any special packages or api is there.

Pls find solution for this one in Java application.

Thanks
Balu

Hello! Newbie back again. I'm rolling along on using CSS for the first time (hooray!) including that wonderful bit of coding in order to center a #Container. The threads here have been *very* helpful.

Due to printing problems with having everything centered at a fixed width (text on the right getting chopped off), I've created a style for media="screen" AND media="print" which works just fine in Netscape and IE.

Question: When I pull the style out of the page so that I can reference it as an external css, do I need to create TWO files?

Also, I would appreciate any/all comments about my first attempt so far. Is there a better way I should be designating font-family and margins for my elements?

<style type="text/css" media="screen">

h1 {color:#003366; font-family:sans-serif; font-size:100%; font-weight:bold; margin:0.4cm 0.4cm}
p {font-family:sans-serif; font-size:85%; margin:0.4cm 0.4cm}
ul {list-style-image: url("redarrow.gif"); font-family:sans-serif; font-size:85%; margin:1cm 1cm}
a:link {color:#003366} a:visited {color:#003366} a:hover {background:#ccccff; text-decoration:none}
html, body {margin: 0; padding: 0; text-align: center; /*for IE stupidity*/}

#container
{
position: relative; /*The container must be positioned
/*in order to contain positioned
/*elements*/
margin: 0 auto; /*This is the proper way to center an element*/
width: 700px;
border: 1px solid gray;
text-align: left; /*corrects for IE hack*/
padding: 0px;
}
</style>

<style type="text/css" media="print">

h1 {color:#003366; font-family:sans-serif; font-size:100%; font-weight:bold}
p {font-family:sans-serif; font-size:85%}
ul {list-style-image: url("redarrow.gif"); font-family:sans-serif; font-size:85%}
a:link {color:#003366} a:visited {color:#003366} a:hover {background:#ccccff; text-decoration:none}
</style>

And here's the page I'm working with so far:

http://www.accd.edu/sac/lrc/librns/celita/design/linktest.htm

Thanks so much for all your help.

Whenever I roll out a new feature (including new layout) to the production version of a website I am working on, I know that it won't properly work until a user downloads a new version of the relevant CSS files. For new users this happens automatically, but existing users have to wait or hit refresh. The result is that the pages look bad for some users when I make changes.

I would fix this problem by renaming the CSS files whenever I make changes, but this can get a bit unwieldy since I use SVN for source code management. I would have to make a revision to other source code files solely to reflect a change in the CSS file.

Another idea is to control the name of the CSS file from a constant or from my database, but each has its downsides (complexity, performance in the case of the db calls).

Is there any easy way to have caching of CSS files, but somehow break through that cache when I make changes? I am guessing not since the cache is based on expiration settings set by Apache, which to be meaningful need to be long. But if you have encountered this issue before, I'd love to hear what you did!

I swear I've done some searching on this but I haven't been able to find a satisfactory answer.

I have a style sheet in the root of my site with this declairation in it:
Code:

#nav
{
	float: left; 
	width: 190px; 
	height: 600px; 
	min-height: 600px; 
	margin-right: 10px; 
	background-image: url(images/gradientBg.jpg); 
	background-repeat: repeat-x;
}

The file the id="nav" is in is being included in the index.php page that's being called from the root also. So we have a structure that looks like this:
Code:

/root
  styles.css
  index.php

/includes
  nav.php

/images
  gradientBg.jpg

The stylesheet is being included like this
Code:

<link rel="stylesheet" type="text/css" href="/styles.css" />

Now for my problem...

The styles and backgrounds all show as expected in Firefox. However, in IE any of the styles that apply to files from the /include directory like nav.php are not followed at all.

I find it hard to believe that my only option is to make the styles inline but I'm not sure what else to do at this point.

Thanks for staying with me this far and for any advice.

Hi all,

I'm using this code for separate CSS style sheets for screen, handheld and print.

<link rel="StyleSheet" href="css/style.css" type="text/css" media="screen" />
<link rel="StyleSheet" href="css/style_handheld.css" type="text/css" media="handheld" />
<link rel="StyleSheet" href="css/style_print.css" type="text/css" media="handheld" />

I'm trying to view these using the Firefox Developer Toolbar and 'Display CSS by media type' options, but it's not working. However, when I do a print preview or actually print the document, it does work. Can anybody tell me why this is and how I can get it working?

Cheers.

Hi, I have a file named button.html with this code:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
input:focus { border: 1px solid navy; }
</style>
</head>
<body>
<input type = "text" />
</html>

When I store it in my desktop, and open it from there, the focus works as expected. But when I store the file in Wamp and open it there either by typing C:\Wamp\www\button.html or http://localost/button.html in the URL bar, nothing happens. Can anybody explain this and offer a remedy?

for my website, i'm going to be using some css for every page in it, would it be advisable to store the css for each page in their own file? or even better in the actual page itself?
if i put it all into one css file i'll end up putting bit spacers:
/*-=-=-=-=-=-=---=-=-=-=-=-=-=-=-=-=-=-=--=-=-=-=-*/
to block things apart

I've been making ok progress with CSS (thanks to your help ) but have come up with a problem when wanting to embed a flash movie into my webpage. How do i do it using CSS?

the follwing Html code works fine but fails upon validation.

Code:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="300" height="300>
        <param name="movie" value="flash/home.swf">
        <param name="quality" value="high"><param name="BGCOLOR" value="#A1D7FD">

        <embed src="fighter.swf" width="250" height="250" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" bgcolor="#A1D7FD"></embed></object>

Any help is appreciated. Also - is it a bad idea including small intro flash movies for webpages?

any help is appreciated