Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!

css background opacity helo please!

edited November 2015 in Help! with 1.x
Hey guys I was wondering if anyone could help me with a css issue in sugarcane 1.42.

I want my passages to have a template consisting of a background image then a text area that is opaque and then characters on the text area that is not opaque at all. Whenever I change the opacity of the passage though, it changes the opacity of my characters too! making it hard to read. How can I keep the opacity of the text area and set a different opacity for my text?

This is my code so far:

<span class="storyText">This is a simple tutorial and introduction to my project, Elijah's story. This story follows Elijah's journey through middleschool and involves him overcoming bullies, teachers, and other enemies he may encounter.

You can check the status of yourself as well as your allies by clicking the HUD option at any time instead of continuing

Good Luck!


.storyText {
color: black;
font-family:"Comic Sans MS";
opacity: 1;

.passage {
/* This only affects passages */

padding: 5px 20px;
width: 500px;
text-align: center;
border-radius: 15px;
margin-bottom: 20px;
opacity: 0.8;


  • note: the height attribute of your .passage rule is missing both a unit and a semi-colon.

    Instead of changing the opacity of the .passage classed element change the opacity of the background colour. Replace both the opacity: 0.8 and background:#F0F0F0 attributes on the .passage rule with the following:
    background-color: rgba(240,240,240,0.8);
  • Thank you this solved the issue.
Sign In or Register to comment.