nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

LiveSite component

Golden_State

Can CSS file be linked from within a XSL in the XSL apprearance section of component? If so, what is the location it should be on TeamSite server?

Thanks for any help!

Find more posts tagged with

Comments

akshathp

Not sure about linking an existing .css file.

However, you can achieve this by using xsl:stylesheet in the appearance xsl.
Use xsl:template and xsl:apply-templates for this purpose.
Within that you can specify all CSS code that you want to use for the page.

Golden_State

Thanks a lot for your help. But I want to leverage existing CSS without having to recreate do all the code.

shanon

>Can CSS file be linked from within a XSL in the XSL apprearance section of
>component? If so, what is the location it should be on TeamSite server?

Yes, you may access any file in the current workarea by using the $URL_PREFIX token.

For example, if your workarea looked like this:


wa1
  - css
    - styles.css
  - images
    - spacer.gif

You could access these in your CSS like this:

<link href="$URL_PREFIX/css/styles.css" ... />

Similarly you could access a static image:

<img src="$URL_PREFIX/images/spacer.gif" ... />

Further, there is support in LiveSite 2.2 for explicit stylesheets on a site level and a page level enforcing global and page-specific styles respectively.

To add a site-wide style sheet, edit the /sites//default.site file and you'll see a section for Shared Resources. This is where you may include 0-n CSS and 0-n JS files in a specific order.

The same fx is accessibly in the Edit Page window via clicking on the Page Settings link on the upper-right link menu.

HTH,
Shanon