在 wordpress 博客文章中添加圆角 div

Question

我正在尝试创建一个类似链接中的博客：http://www.wikihow.com/Grow-Flowers-from-Seed

每个步骤都有单独的部分，圆角，不同的背景颜色和中心对齐。

到目前为止，我在 wordpress 中写的是：

<div style="width: 90%; background-color: #eaeaea;">
     <a href="http://prelaunch.biocarve.com/blog/wp-content/uploads/2015/12/670px-Grow-Flowers-from-Seed-Step-1.jpg"><img class=" size-medium wp-image-258 aligncenter" src="http://prelaunch.biocarve.com/blog/wp-content/uploads/2015/12/670px-Grow-Flowers-from-Seed-Step-1-300x225.jpg" alt="Grow Flowers From Seeds step1" width="450" /></a>
    <div style="width: 5%; padding: 0 10pt 0 0; float: left; background-color: #eaeaea;">
        <b>1</b>
    </div>
    <div class="step" style="width: 95%; padding: 0 10pt 0 0; float: left; background-color: #eaeaea;">
        <b class="whb">Choose a container.</b> There are a variety of inexpensive options available. Germinating flats are cheap and specifically created for the purpose of germinating seeds. Plastic drinking cups and recycled egg cartons are other inexpensive options, however. Small flower pots will also work.
    </div>
</div>

现在我得到的看起来像： 请让我知道我哪里错了，我怎么能有圆角。

Answer 1

只需添加这个类并将该类传递给给 <div> 以将图像遮盖一个圆角

.roundedCorner{ 

  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;

}