How to attach a CSS style sheet ?

Hi,
How to attach a CSS Style sheet to a portal page ?
Thanks for your help,
Jean-Christophe

For a standard Portal page you should use the Portal styles and associate them to a page. These effectively generate a CSS style sheet anyway if you view the HTML source of a rendered page in your browser.
Using the correct PDK APIs you effectively reference the CSS tags in your Java or PL/SQL code.
If your portlet need to open a page in a new window you can no longer reference the Portal page style as the CSS style sheet does not get attached.
In this situation, code your HTML as normal and reference your CSS style sheets as normal.
If you create you CSS sheet you can store it in a page as a file and access using the direct access URL like I showed you in a previous response regarding the storing of images.
Cheers,
John

Similar Messages

When I try to attach my css style sheet Dreamweaver gives me an error saying that my .css file appears to be an .html file and will not attach. How do I fix this so I can attach my style sheet?

I have built a css style sheet in Dreamweaver. When I try to attach it to my html website, it prompts me that my "css file appears to be an .html file and cannot attach". I've tried removing the /* */ as suggested by other forums, but this has not resolved the issue. I was using css style sheets with no problem 2 days ago. Now I get that error message. How do I fix this so I can attach my style sheet?

What does the code of the CSS file look like?
An external CSS file needs to be written in CSS only (no html tags like <html>, <body>, <head>, etc ).
It also must have a .css file extension, if yours has a .html extension it won't work.

How to bring Sample CSS Style Sheets into a Template?

I am creating a site from scratch using CS4 Template. Can I incorporate more than one DW Sample CSS Style Sheet? And how do I bring them into the Template site?
Thanks, g

Thank you. I added the 3 sample css style sheets I want to use into my site. Now I am trying to bring a different sample css into different sections of the layout. Example:
Sidebar 1: green/yellow
Sidebar 2: red/yellow
Middle: blue/yellow
I seem to only be able to have one for the whole page. Is this true?
What I am doing is clicking on the div tag: <div.sidebar#sidebar1>, then "Edit CSS" and then scroll down in the Class window to "attach style sheet" and there at the bottom is a link to the sample css style sheets. I click on the one I want and it changes the css for the whole page not just the sidebar 1. Is there a way I can get a different css sample style sheet for each sidebar in a 3 column layout, and a different sample css for the middle?
thank you very much

Attach existing CSS style sheet to existing site

Hello all,
I have an external CSS style sheet called default.css. I have an existing site of 61 pages that I want to apply default.css. Is there a way to apply a CSS file to multiple pages? Or am I doomed to going through the process 61 times?
Thanks for your time.

Thanks for replying Ben.
I 'forced' it to work. Fortunately, the pages were all linked to the same style sheet, so I just did a 'Find and Replace All'.
Thanks again.

Automatically attaching CSS style sheets to new documents

I wanted to alert everyone to a great new Community article published by Adobe Community Expert David Powers. The article details how to attach CSS style sheets automatically when you create new documents.
Here's the article:
http://kb2.adobe.com/community/publishing/505/cpsid_50564.html
This handy option is easy to miss, especially if you don't use the New Document Dialog box to create documents, so big thanks to David for highlighting this.
Furthermore, the appearance of such an article is a great example of how Community content can interact and live symbiotically with Adobe Help. We've linked directly to David's piece from our documentation, and this is indeed a great thing because David is able to go into much more detail about the process of automatically attaching style sheets than we are able to do in Help:
Create a blank page
Create a page with a CSS layout
If you're interested in publishing Community articles of your own, you can download the Community Publishing AIR application and get right to work!

Jon Michael Varese wrote:
We've linked directly to David's piece from our documentation, and this is indeed a great thing because David is able to go into much more detail about the process of automatically attaching style sheets than we are able to do in Help:
Can I ask why?
David's excellent standard should be the minimum standard for Help files.
The quality of software manufacturers' Help (not just Adobe) has deteriorated greatly over the past decade - to the point where it's now my last resort for learning.
Software manufacturers seem to tacitly rely on 3rd party book authors (such as David's brilliant material), bloggers and online tutorials to explain their products these days.
I'm happy not to have a printed book with my software any more because they were always out-of-date and hard to update. However the quality of PDF and online Help docs is so poor and sparse for my use that I prefer to get my answers by Googling, visiting forums or buying the occasional book.

How to Make a "fonts.css" style sheet

Hi, I have a wordpress blog with a stylesheet named “style.css”. I want to change the fonts in the style sheet and so I want to create a separate style sheet named “fonts.css"
I could just duplicate the ”style.css” page and then rename it “fonts.css” but I believe I read somewhere it is better to create a new style sheet named “fonts.css” and then add my font styles to that. Doens anyone know of a tutorial or how I make the new style sheet and add my fonts?

I only typically use two stylesheets on any given site, layout.css and styles.css. One is for the overall layout/positioning info of the site and the other is the style information which would include fonts, colors, shadows, transitions, etc.
If it is better in your mind and for your workflow to create a third stylesheet just for the font values, go for it. To me, fonts are just another style element though, so they stay in my styles.css file.
There's really no right or wrong to doing it either way. Just make sure you create another link in the head section of your site to the new file if you create fonts.css.
Thanks jon,
Yes I agree, I could just change the fonts in “style.css” and then have less style sheets, but the themes developer told me to create a new style sheet named “fonts.css” only because the theme is updated regularly and uploading a new theme will write over the file named “style.css” and then your fonts will default to their original fonts.
I don't see anything wrong with that approach. Just remember that if you have both styesheets linked to the same page then the page will get it's css styles from the last linked stylesheet.
So for instance if you have:
body {
font-size: 14px ;
in the style.css
and
body {
font-size: 12px ;
in the fonts.css
and the last linked stylesheet was styles.css the page would display 14px text.
So you just need to get them in the right order IF you have more than one styleshet linked to a page.
Thanks Osgood,
Yes that was my other question. So in my uploaded CSS folder I have the original “style.css” file and now my new “fonts.css” file. “style.css” is above the “fonts.css” file and both contain the same information except the file “fonts.css’ has been changed to use different fonts.
So if I understand you correctly I need to either move the file “fonts.css" above the file “style.css” or delete “style .css” from the CSS folder so the file “fonts.css” will take precedence. Is this correct?
Also, I needed to open style.php and edit the code to include “fonts.css” which I did.
I opened "style.php" and then added the code in "red" then uploaded it to the (CSS) folder on the server.
<?php
header( "Content-type: text/css" );
$files = array();
$files[] = 'style.css';
$files[] = 'responsive.css';
$files[] = 'fonts.css';
foreach($files as $file) :
    $content = @file_get_contents( $file );
    echo minify( $content );
endforeach;
function minify( $code ) {
          $code = preg_replace( '#\s+#', ' ', $code );
          $code = preg_replace( '#/\*.*?\*/#s', '', $code );
          $code = str_replace( '; ', ';', $code );
          $code = str_replace( ': ', ':', $code );
          $code = str_replace( ' {', '{', $code );
          $code = str_replace( '{ ', '{', $code );
          $code = str_replace( ', ', ',', $code );
          $code = str_replace( '} ', '}', $code );
          $code = str_replace( ';}', '}', $code );
          return trim( $code );
?>
After doing all of this I still didn’t see any changes to my fonts so I must have done something wrong.
Any ideas?

Trouble attaching css style sheet in DW MX

Trouble attaching css style sheet in DW MX (NOT DW MX 4)
I am currently using Dreamweaver MX , and for some reason, in
design view, the style sheet does not attach (a least I can't see
the change). My divs, and images are all stuck to the upper left
corner, as though it were not attached.
A friend told me it was because I have MX and Not MX 4 , does
this matter?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01
Transitional//EN"
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<title>Schedules</title>



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

</script>
</head>
<body
onLoad="MM_preloadImages('images/leaguehistory2.gif','images/eventscalendar2.gif','images /community2.gif','images/allovflteam2.gif','images/sponsorship2.gif','images/contacts2.gif ','images/forms2.gif','images/links2.gif','images/join2.gif','images/photogallery2.gif')">
<div id="container2">
<div id="top_nav">
<div id="ovfl_nav">
<form name="ovfl" class="left_topnav">
<img src="images/ovfl.gif" width="51" height="14">
<select
style="font-size:10px;color:#000000;font-family:arial,
helvetica;background-color:#ffffff;" name="menu"
onChange="window.open(document.ovfl.menu.options[document.ovfl.menu.selectedIndex].value) ;">
<option value=''>OVFL SITES</option>
<option value="
http://www.ovflfootball.org">OVFL
Football Site</option>
</select>
</form>
</div>
<div id="afc_nav">
<form name="afc" class="topnav">
<img src="images/afc.gif" width="44" height="14">
<select name="menu"
style="font-size:10px;color:#000000;font-family:arial,
helvetica;background-color:#ffffff;"
onChange="window.open(document.afc.menu.options[document.afc.menu.selectedIndex].value);" >
<option value=''>AFC TEAMS</option>
<option value="
http://www.columbusblackhawks.com">Blackhawks</option>
<option value="
http://www.eteamz.active.com/WVCrash/index.cfm">Crash</option>
<option value="
http://">Flames</option>
<option value="
http://www.cincinnatigamblers.com/HOME.html">Gamblers</option>
<option value="
http://www.wkpunishers.org">Punishers</option>
<option value="
http://www.circlecitysoldiers.com">Soldiers</option>
<option value="
http://theohiostorm.tripod.com/id4.html">Storm</option>
<option value="
http://www.derbycitythunder.com">Thunder</option>
<option value="
http://eteamz.active.com/MarionWolfpack">Wolfpack</option>
<option value="
http://hardincountywolverines.com">Wolverines</option>
</select>
</form>
</div>
<div id="nfc_nav">
<form name="nfc" class="topnav">
<img src="images/nfc.gif" width="45" height="14">
<select name="menu"
style="font-size:10px;color:#000000;font-family:arial,
helvetica;background-color:#ffffff;"
onChange="window.open(document.nfc.menu.options[document.nfc.menu.selectedIndex].value);" >

How to bring 3 different Sample CSS style sheets into 3 different areas of DW Layout?

I added the 3 sample css style sheets I want to use into my site. Now I am trying to bring a different sample css into different sections of the layout. Example:
Sidebar 1: green/yellow
Sidebar 2: red/yellow
Middle: blue/yellow
I seem to only be able to have one for the whole page. Is this true?
What I am doing is clicking on the div tag: <div.sidebar#sidebar1>, then "Edit CSS" and then scroll down in the Class window to "attach style sheet" and there at the bottom is a link to the sample css style sheets. I click on the one I want and it changes the css for the whole page not just the sidebar 1. Is there a way I can get a different css sample style sheet for each sidebar in a 3 column layout, and a different sample css for the middle?
thank you very much

You can't bring 3 of the sample CSS style sheets together because there are defined areas like tables and lists and paragraphs that are just being redefined. Then what happens is the browser picks (usually the last set) the instructions it wants to use to display the content. The only way around this is to save a copy of the 3 CSS documents and open them at the same time. Then use one as your master which will be linked to the page and grab colors from the other CSS documents.

How can i load a specific CSS style sheet for Safari?

Okay, So I have some structure issues when viewing my website on Safari compared to Firefox. Is there a way to put a code in the <head> tag to load a specific CSS style sheet for Safari like you can do with IE?
Thanks.

I took a screenshot of your page from Firefox (shown below). I assume you're seeing the same problem in Safari. If you increase text size one click, the keyboard image drops below the #contact division.
1) Height is a restiction in all browsers except IE. Avoid using height values on containers with text in them. If needed to show a background image, use the min-height property.
2) Fix your code errors. Some browsers are very sensitive to errors.
3) Your #content lacks cohesion. You need 3 columns, each with a width in pixels. Or simply use a 3-column table.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com

How to apply a css style to a radio button.

I cannot seem to persuade jsf to pass css styles through to a radio button.
I have markup like this:
<h:selectOneRadio id="direction" styleClass="largish-form" >
<f:selectItem id="positive" itemLabel="positive" itemValue="positive" />
<f:selectItem id="negative" itemLabel="negative" itemValue="negative" />
</h:selectOneRadio>Which gets transformed into something like:

<td>
<label>
<input type="radio" name="comp-amount-form:direction" value="positive" class="largish-form" />
positive
</label>
</td>So the style does not get applied to the text of the label. I was expecting something like
<span class="largish-form"> positive</span>.So how do I get styled labels on my radio buttons?
Thanks in advance.

For a standard Portal page you should use the Portal styles and associate them to a page. These effectively generate a CSS style sheet anyway if you view the HTML source of a rendered page in your browser.
Using the correct PDK APIs you effectively reference the CSS tags in your Java or PL/SQL code.
If your portlet need to open a page in a new window you can no longer reference the Portal page style as the CSS style sheet does not get attached.
In this situation, code your HTML as normal and reference your CSS style sheets as normal.
If you create you CSS sheet you can store it in a page as a file and access using the direct access URL like I showed you in a previous response regarding the storing of images.
Cheers,
John

Problems attaching an external style sheet to several HTML files created with a template

Hello All;
I've been working on a task that should have taken me a few minutes but instead, it's been taken all day.
I am creating a site using a template and out of the template, I've created about 6 html files each of which is a different page off the main menu.
I created a blank css file and tried to attach it to one of the menu pages but it keeps saying that the link failed.
If you want to see my code, follow the link below ...
http://www.dedula.net/balloonsat/Contact.html
I am trying to attach a separate style sheet to this page so that I can style the table differently than other pages that use a table but up until now, I have not figured out how to do that in DW. I am not proficient at writing CSS code directly so I am using DW - hope that's possible.
While templates seem very useful, they are also a source of fustration for the beginner.
Tim

To add to what Snakeyes has said, it should have created the "head" editable region to include your <title> opening and closing tags. So I would suggest that you change this
<title>Balloonsat High Altitude Flight (BHALF) - Home</title>
To this

<title>Balloonsat High Altitude Flight (BHALF) - Home</title>

Then directly after the closing <title> tag, add whatever head content you need.
Gary

Unexpected error when linking CSS style-sheet

I have been working on this site for over a month now. I have
a linked external CSS style sheet and everything has been working
seamlessly between Dreamweaver and the web. Today, I tried to
create a template and then disliked it, so I deleted it. After
doing that, my CSS rules were no longer displaying properly EVEN
THOUGH my formatting and everything has remained the same.
I have a feeling there is something cached behind the scenes
that is messing this all up. Community assistance is greatly
appreciated. This is not the first time I've been unable link a CSS
stylesheet.

upload the page and post a link, please.
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.dreamweavermx-templates.com
- Template Triage!
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
http://www.macromedia.com/support/search/
- Macromedia (MM) Technotes
==================
"rausch_g" <[email protected]> wrote in
message
news:f7im8a$7u4$[email protected]..
> This is not a display issue with the toolbar. There is
clearly a
> stylesheet
> attached in the header; however, in Dreamweaver when I
look in the
> "properties"
> panel while in CODE VIEW, it says there are no styles
and no attached
> style
> sheet. When I try to attach my style sheet, it says, "An
unexpected error
> occured while trying to read style-sheet information."
There are no
> errors on
> my style sheet, so I am unsure how to fix this.
>

CSS Style Sheet Link Recursive Error?

I am trying to link a css style sheet to a new root file. When I try to link the css sheet I get an error - A recursive style import was found while trying to add Check Magazine.css. Please resolve this error by editing the file in an external text editor and try again.
What does this mean? I looked up recursive style everywhere and there is no explanation. I don't know how to fix. The answer I found on these forums mentioned an @import statement error but I dont even have any @import statemensts in my style sheet this style sheet is part of the Getting Started tutorial on this website.
@charset "utf-8";
#container{
width: 968px;
background: #FFFFFF;
margin: 0 auto;
padding-left: 10px;
padding-right: 10px;
overflow: hidden;
This is my code, can you help?

This is my index.html code, I am so lost as to what to do to get rid of this stupid error. My style sheet is not linked so of course it is useless and I have to code on both documents since the code doesnt show up automatically on the Style sheet when I add something to the index page
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Check Magazine</title>
<style type="text/css">

</style>
</head>
<body>
<div id="container">
<div id="banner"></div>
<div id="main_image"></div>
<div id="left_column">Content for id "left_column" Goes Here</div>
<div id="column_container">
<div id="right_column">Content for id "right_column" Goes Here</div>
<div id="center_column">Content for id "center_column" Goes Here</div>
</div>
</div>
</body>
</html>

Using custom CSS style sheet

I'm trying to use a custom CSS style sheet and can't get it to work. I've created my stylesheet and uploaded it so it shows under Shared Components >> Cascading Style Sheets.
Viewing the source for my pages currently shows a reference to what I guess is the default style sheet -
<link rel="stylesheet" href="/i/css/apex_3_1.css" type="text/css" />But no reference to the one I uploaded. So I guess I need to add a new reference pointing to my sheet.
So questions would be -
- How and where do I add this reference?
- Is this the correct way to do things if I want to use my own styles?

Antilles,
Go to your Shared Components > Temples > Select the page template you wish to apply your CSS to and in the "Header" area you will see references to the APEX CSS, something like,
<link rel="stylesheet" href="#IMAGE_PREFIX#themes/theme_17/theme_3_1.css" type="text/css" />Now, just add your CSS reference after any APEX CSS references.
Hope this helps.
-Chris

Problem linking css style sheet

I am trying to link a css style sheet to a new root file. When I try to link the css sheet I get an error - A recursive style import was found while trying to add CFTtemp.css. Please resolve this error by editing the file in an external text editor and try again.
What does this mean? I looked up recursive style everywhere and there is no explanation. I don't know how to fix. This css sheet works in other sites.
screen shot attached

Perhaps some CSS statement in the stylesheet is trying to import your stylehseet! Thus the recursive warning. Look for "@import" statements and see if its trying to import the stylesheet. Then either comment them out (/*your old CSS*/) or remove it. Save. And see if that solves it. But not being able to see your whole stylesheet, this is only a guess.

How to attach a CSS style sheet ?

Similar Messages

Maybe you are looking for