关于相同的浏览器在WINDOWS和MAC中的CSS

Question

以下部分在WINDOWS中在不同浏览器中页面表现看起来相同

<div class="store-hour-selector">
                    <div class="store-hour-selector-label">
                      <h3 id="style"></h3>
                      <select>
                        <option value="">ー</option>
                      </select>
                    </div>
                    <div class="store-hour-selector-label">
                      <span class="mark"></span>
                    </div>
                    <div class="store-hour-selector-label">
                      <h3 id="style"></h3>
                      <select>
                        <option value="">ー</option>
                      </select>
                    </div>
                    <div class="store-hour-selector-label">
                      <h3 id="style"></h3>
                      <select>
                        <option value="">ー</option>
                      </select>
                    </div>
                  </div>

css部分省略:

@-moz-document url-prefix() {
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@supports (-ms-ime-align:auto) {
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@supports (-ms-accelerator : true) {
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@media screen\0, screen\9 {
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@media (min-width: 1024px){
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

@media (min-width: 768px){
    div.store-hour-selector-label .mark:before {
        bottom: 23px;
    }
}

还想请问如果可否直接在css中定义: 在浏览器相同的情况下( 比如chrome) 有没有办法分辨出windows和mac从而使得在任何情况下页面表示都保持相同

而并非直接在HTML做如/<!--[if IE]>一样的判断

Answer 1

@-moz-document 这个样式只在Firefox下有效，将bottom改成了23px，Chrome还是默认的34px