CODEWITHSUNDEEP
htmlcssresponsive-designmedia-queriesstylesheet
av17
av17

Reputation: 105

styling media queries, Ignoring/ overriding parent styles

So I'm currently working on a responsive site and i'm trying to set the styles in the media query. However, the styling in the parent css is conflicting.

The parent style sheet holds this:

.sec1 p  {

text-align: left;
width: 55%;
margin-left: 8%;
float:left;
margin-top: 100px;
}

And the code for the 768 width:

    .sec1 p  {
    letter-spacing:normal;
    word-spacing:normal;
    font-size: 1.1em;
   width:none!important;
   margin-left:none!important;
   margin-top:none!important;
   text-align:inherit!important;
      }

As you can see, i tried to set a width:none; margin-left: none; But I don't even know if that's proper or effective,

In short, as you can see by my blaring code what I don't want, how do I do this?

Hopefully I am being clear, thanks!!

Upvotes: 0

Views: 258

Answers (1)

Faust
Faust

Reputation: 15404

Width none is not valid.

Set width: auto to revert the item to the default behavior

or width:0 to set it to 0-width.

Also, for !important you need a space between the end of the property value and important, like this:

margin-left: 0 !important;

Upvotes: 1

Related Questions