Sugarcube stylesheets and link colors?

Authoring Twine
1

Please specify version and format if asking for help, or apply optional tags above:
Twine Version:2.3.8
Story Format: SugarCube 2.31.1

Trying to get the colors right and can’t find a good example of making Stylesheets work like CSS examples

So my code below tries to make all text white, but I still get blue links!
Thanks in advance!

body {
background-color:#33a585; 
}
{
  font-family: Courier;
  font-size: 36px;
  text-color:#ffffff
}
/* unvisited link */
a:link {
  color: #ffffff;
}

/* visited link */
a:visited {
  color: #ffffff;
}

/* mouse over link */
a:hover {
  color: #ffffff;
}

/* selected link */
a:active {
  color: #ffffff;
}
2

The problem is here:

body {
background-color:#33a585; 
}
{
  font-family: Courier;
  font-size: 36px;
  text-color:#ffffff
}

You don’t have a selector for the second { ... } section, thus all of the CSS after that is broken.

Perhaps you meant something like this?

body {
	background-color: #33a585; 
}
#story
{
	font-family: Courier;
	font-size: 36px;
	text-color: #ffffff;
}
a, a:visited, a:hover, a:active, a:focus {
	color: #ffffff;
}

Note that I also changed the :focus color there. For more information, see “CSS Selectors”.

Hope that helps! :smiley:

3

It could be overridden by other elements, id or classes. To check the styles, use the style inspector in your browser. It will show you all the styles applied to a single element, and if a few styles are assigned to the same element, which one was actually applied.

To use the style inspector, right-click on your link and select inspect element in the latest firefox and chrome.

btw, did you try the most simple

a {
  color: #ffffff;
}