CODEWITHSUNDEEP
twitter-bootstrapcss
Behseini
Behseini

Reputation: 6328

Background transparent not working

Can you please take a look at this demo and let me know why the CSS rules of background-color: transparent; are not functioning on bootstrap panel body?

#collapseOne .panel-body { background-color: transparent; }
.panel-body { background-color: transparent; }

Upvotes: 3

Views: 15471

Answers (2)

Mehrshad Farzaneh
Mehrshad Farzaneh

Reputation: 694

Also, never, ever forget to use !important.

background-color:transparent !important;

Upvotes: -1

Rahul
Rahul

Reputation: 5844

Because you are not applying the CSS in right place. You should apply your background transparent in <div> having class pannel Default.

Here is the running Example:

Here is the Example:

<div class="panel panel-default" style='background:transparent'>
<div class="panel-heading" role="tab" id="headingOne">
  <h4 class="panel-title">
    <a role="button" data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
      Collapsible Group Item #1
    </a>
  </h4>
</div>

I have written Inline CSS just for example to show.But don't go with it. To make permanent effect navigate to your bootstrap CSS file and change this line 

.panel{
    background-color:#fff;
  }

to this one

 .panel{
    background-color:transparent;
  }

It will make all your panel's background transparent.

Upvotes: 3

Related Questions