如何为<kbd>标记

Question

在grails项目中，我有一个类似下面的CSS来覆盖默认的kbd config

.tool-preview kbd {
    display: inline-block;
    width: 45px;
    font-size: 10px;
    text-align: right;

和gsp一样

<div class="custom-indicators-row-one">
    <div class="indicator-1 pull-left" >
        <kbd></kbd>
    </div>

    <div class="indicator-2 pull-right" >
        <kbd></kbd>
    </div>
</div>

有一个javascript将填充kbd标记的值。假设我希望div class="indicator-1 pull-left"和div class="indicator-2 pull-right"下的值具有不同的宽度，这怎么办？目前kbd css的任何宽度变化都会影响gsp中具有kbd的div。

Answer 1

你可以写这样的css

.indicator1 kbd{
/*your css*/
width: 300px;
}

.indicator2 kbd{
/*your css*/
width: 400px;
}

这对我有用。