user2012677
user2012677

Reputation: 5745

Remove Media Queries in CSS with Custom.css file

I have a standard.css file, which is from a template design I downloaded. I have another custom.css, which I modified specific CSS tags contained in standard.css. I do not want to modify the standard.css file.

Within my standard.css file is a media query that I want to remove with the custom.css file. How can I get the custom.css file to discard a media query in the standard.css file?

I know I can override each value of the query to its pre-query value, but that is a lot more work and I do not know all the values to do so. This is one example, but I have many other media queries in the standard.css file, so making overriding on each value would be very hard.

@media (min-width: 1200px) {
  .timeline > li {
    min-height: 170px;
  }
  .timeline > li .timeline-panel {
    padding: 0 20px 20px 100px;
  }
  .timeline > li .timeline-image {
    width: 170px;
    height: 170px;
    margin-left: -85px;
  }
  .timeline > li .timeline-image h4 {
    margin-top: 40px;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
    padding: 0 100px 20px 20px;
  }
}

Upvotes: 2

Views: 792

Answers (1)

NeilWkz
NeilWkz

Reputation: 245

Unfortunately you can't. You need to either override each value, or delete the rules from the original file. If the original file is not under your control, take a copy of it and remove the styles then load that copied css file instead.

Upvotes: 1

Related Questions