css not displaying properly

lauren.fraser's Avatar

lauren.fraser

10 Nov, 2010 04:17 PM

I have added a css file to my global preferences and added the classes in the correct field.
When I go to the editor, I can see the classes in the styles drop down menu. When I publish the site and view source, I can see the classes are properly coded.

However, the styles are not rendering properly on the screen. I am specifically working on an "imagelink" class to remove the border, and a second link class to change the color of specific links.

  1. 1 Posted by Lee Roberson (F... on 10 Nov, 2010 09:57 PM

    Lee Roberson (Function Digital LLC)'s Avatar

    Not sure about a solution to the problem you're having with Cascade, but around here it is basically 100% common practice to put a rule into our CSS like:

    a img { border: none; } which turns off the border for any image on any page that is within a link. I can't think of a time in years when it has ever been desirable.

  2. 2 Posted by Penny on 15 Nov, 2010 07:56 PM

    Penny's Avatar

    Hi Lauren,

    Are you saying that the page is not rendering the CSS properly within the CMS when just viewing it? Or within Edit mode?

    If it is just when viewing the page, I would verify that the link to your CSS within your page is formatted for where it is located in the CMS. Some people have their CSS in /files/css/screen.css and abbreviate it to ../../screen.css. The second method will not always work in Cascade and I wonder if that is your issue. If it is not, can you please send me the snippet of your code that links your CSS file. Also, can you send me a screenshot of your CMS structure.

    Also check and see if when you click the Preview tab on the page, if your CSS displays properly then.

    Sorry for all of the questions and requesting additional info. CSS and JS should generally work within Cascade as long as the paths are recognized.

  3. 3 Posted by lauren.fraser on 15 Nov, 2010 09:08 PM

    lauren.fraser's Avatar

    Penny,
    Thanks for the response. I checked the path and we are using the full path (_common/css/main.css).

    I realized that I added the content by pasting html with styles already applied before I added the style sheet and the style list in the Site Configuration menu.

    So I went to my html block, deleted the content that were using the associated styles. I re-added the content then applied the styles and everything appears to be working.

  4. 4 Posted by lauren.fraser on 16 Nov, 2010 04:08 PM

    lauren.fraser's Avatar

    Penny,
    I have another css related question. I created a xhtml block and want to apply some css to the div in that block.

    I created a class in my css file - using a system-asset tag to define the image. I have checked the rewrite links in file.

    I don't see the background image or other attributes.

    I don't really want to add the class to my site Preferences, because my end users would never need to choose it. And I'd like to keep their styles list to a minimum. If I have to add it to the Site Preferences, is there a way to restrict the styles displayed in the WYSIWYG editor based an roles, groups or users?

    I've uploaded my files (css and the html I'm using in the block). It seems like I'm missing a piece of the puzzle here.

  5. 5 Posted by Penny on 16 Nov, 2010 06:33 PM

    Penny's Avatar

    Hey Lauren,

    The one glaring issue I see is in your CSS file. The following:

    [system-asset]__common/images/bg_images/give_box.gif[/system-asset]

    Should be:

    [system-asset]/__common/images/bg_images/give_box.gif[/system-asset]

    Notice the slash I added. This path assumes that your common folder is preceded by two underscores. If it isn't, that may need to be adjusted as well. If the path is being rewritten properly, you should see it changed into /rederfile/alotofotherstuff, once you save and view the CSS file.

    You should not have to make the class available in the dropdown to users.

    I hope this helps.

  6. lauren.fraser closed this discussion on 09 Dec, 2010 02:09 PM.

Comments are currently closed for this discussion. You can start a new one.

Keyboard shortcuts

Generic

? Show this help
ESC Blurs the current field

Comment Form

r Focus the comment reply box
^ + ↩ Submit the comment

You can use Command ⌘ instead of Control ^ on Mac