0

これらのラジオボックスを div の topchoice と bottomchoice の上に置きたいと思います。「choicefirstleft」と「choicesecondleft」の div の幅を変更すると、幅が実際には 100% になることがあります。jsfiddle の例でわかるように、幅が 100% に近づくとすぐに、ラジオボタンが下に移動します...

これらのボタンが色付きの div の上にあるようにするにはどうすればよいですか? 手がかりがありません。

HTML:

<div id="results">
    <div id="topchoice">
        <div class="result">
            <?php echo $topresult; ?>
        </div>
        <div id="choicefirstleft">
            <label for="yes">Ja</label>
        </div>
        <input type="radio" id="yes" value="1" name="votingvalue"></input>
    </div>
    <div id="bottomchoice">
        <div class="result">
            <?php echo $bottomresult; ?>
        </div>
        <div id="choicesecondleft">
            <label for="no">Nein</label>
        </div>
        <input type="radio" id="no" value="2" name="votingvalue"></input>
    </div>
</div>

CSS:

 #topchoice{
        margin-top: 40px;
        overflow:hidden;
        background-color: #000;
        opacity: 0.9;
    }

    #bottomchoice{
        margin-top: 5px;
        overflow:hidden;
        background-color: #000;
        opacity: 0.9;
    }
    #choicefirstleft{
        width:30%;
        background-color:greenyellow;
        float:left;
        z-index: 1;
    }
    #choicesecondleft{
        width:99%;
        float: left;
        background-color: red;
        z-index: 1;
    }

    #results{
         font-size: x-large;
        width: 50%;
        margin:0 auto;   
        color: white;
        overflow:hidden;
    }

    #results input{
        float:right;


        z-index: 4;
    }

http://jsfiddle.net/K3Qgf/

4

1 に答える 1

0

容器を作りました

position: relative; 

その後

position: absolute;

ラジオボタンで(新しいクラスで)

http://jsfiddle.net/K3Qgf/1/

于 2013-08-27T13:02:55.103 に答える