CODEWITHSUNDEEP
htmlcsstwitter-bootstraptwitter-bootstrap-3
code-8
code-8

Reputation: 58810

How can I take-off drop shadow effect from a panel Bootstrap?

I have an banner that act as an accordion.

enter image description here

As default, the bootstrap panel class come with drop-shadow effect. I want to take off the shadow around my panel-heading, and also my panel-body. I've tried to override it by giving a class no-shadow

.noshadow {
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}

Result, It still showing up. :(

Any helps / suggestions will be much appreciated

JSFiddle

Upvotes: 0

Views: 3581

Answers (2)

Jacob
Jacob

Reputation: 2165

It's using borders and not box-shadow. Updated your JSFiddle here.

/*--------- add this to override Bootstrap ----------*/
.panel {
    border: none;
}

.panel-default .panel-heading {
  /*border: 1px solid silver; --------- remove this line ----------*/
  min-height: 100px;
  background-color: white;
  border-radius: 0px;

}

Upvotes: 1

Praveen Singh
Praveen Singh

Reputation: 2567

It is not a shadow. It is actually border on panel div. See this fiddle: http://jsfiddle.net/jd94vttr/1/

Upvotes: 1

Related Questions