Can anyone Help me convert this image into HTML and CSS? [closed]

I need to turn this picture into a HTML content.I am trying again and again.But I cant make it. Can anyone help me with this?

Tomake

This is all I tried:

#group div.current{
    display: block;
    border: 1px solid red;
}
btn-group{
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

<div id="group">
    <div>
        <p></p>
        <div class="btn-group">
            <button>Apple</button>
            <button>Samsung</button>
            <button>Sony</button>
            <button>Sy</button>
        </div>
    </div>
</div>
<div id="next">next</div>

Answer

There you go:

<div style="height:150px;width:300px;border-radius:50px;border:1px solid black;padding:40px">
  <div style="font-size:30px;">Text</div>
  <div style="float:right;position:absolute;top:20px; left:200px;">
    <input type="button" value="button1" style="height:40px;width:90px;border-radius:30px;outline:none;border:1px solid black;color:white;background-color:#5dbb63;margin:5px;"><br>
    <input type="button" value="button2" style="height:40px;width:90px;border-radius:30px;outline:none;border:1px solid black;color:white;background-color:#5dbb63;margin:5px;"><br>
    <input type="button" value="button3" style="height:40px;width:90px;border-radius:30px;outline:none;border:1px solid black;color:white;background-color:#5dbb63;margin:5px;"><br>
    <input type="button" value="button4" style="height:40px;width:90px;border-radius:30px;outline:none;border:1px solid black;color:white;background-color:#5dbb63;margin:5px;">
</div>
<div style="float:right;position:absolute;top:100px; left:40px;">
    <input type="button" value="button5" style="height:40px;width:90px;border-radius:30px;outline:none;border:1px solid black;color:white;background-color:#5dbb63;margin:5px;">
</div>

Advertisement

Answer