-1

I am creating a navigation bar which I want to have a white background for, although I only want the white to be transparent, whenever I currently change the transparency it makes the whole transparent. How can I change my code so that only the white background is transparent?

  <div class="col-md-10"><div id="navigation" style="background-color:white; opacity: 0.5;"> <ul class="nav" style="margin-left: -20%;">
  <li><a href="MusicFestival.php">Home <i class="far fa-arrow-alt-circle-right"></i></a></li>
  <li><a href="Friday.php">Friday <i class="far fa-arrow-alt-circle-right"></i></a></li>
  <li><a href="Saturday.php">Saturday <i class="far fa-arrow-alt-circle-right"></i></a></li>
  <li><a href="Sunday.php">Sunday <i class="far fa-arrow-alt-circle-right"></i></a>  </li>
CoderHarry
  • 13
  • 6

1 Answers1

-1

I just searched for "make div background transparent without affecting content" on google.

Here is the code sample using RGBA

.myelement {
    background: rgba(200, 54, 54, 0.5);
}

There is already an answer to your question on StackOverflow. Just follow this link : Opacity of a DIV without affecting content

And some more tips here : RGBa Browser Support

VirussInside
  • 187
  • 17