Как переопределить margin и right / left в css?

у меня есть div с этим стайлинг:

#slogan{
    font-size:24px;
    position:absolute;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
}

последние 4 стиля просто центрируют содержимое div на странице.

Если страница становится слишком большой, я больше не хочу использовать следующий стиль, поэтому я применяю этот стиль:

@media only screen and (min-width: 941px){
    #slogan {
        font-size: 24px;
        position: absolute;
        min-width: 810px;
        text-align: right;
    }
}

который отображает содержимое определенного количества с левого края страницы. Я протестировал эти стили в инструменте F12 dev, и это выглядит правильно. Однако, когда я применяю стиль внутри листа css, поле и справа / слева части все еще применяются к элементу, и я не знаю, как их отменить (нет значения по умолчанию для margin).

помочь?

6
css css3 html

4 ответов

использовать none, inherit или initial отменено.

@media only screen and (min-width: 941px){
    #slogan {
        font-size: 24px;
        position: absolute;
        min-width: 810px;
        text-align: right;
        margin-left:none;
        margin-right:none;
    }
}
8

вы можете попробовать:

margin-left: unset;
margin-right: unset;

но я не уверен, насколько хорошо они поддерживаются. Также можно установить их в 0, который по умолчанию;

3

вы также можете установить @media другим способом

@media only screen and (max-width: 941px){
   #slogan {
    position:absolute;
    left:0;
    right:0;}
  }
1

Если вы хотите перезаписать css, то вам нужно использовать !важно после атрибута, как показано ниже :--

#slogan{
    font-size:24px;
    position:absolute;
    left:0;
    right:0;
    margin-left:auto !important;//Whatever u want to overwrite
    margin-right:auto !important;
}
0