0
我在我的主页上使用jssor图像滑块。在它旁边将是一段文字。我无法让文字环绕jssor图像滑块。我已经尝试过浮动和文本对齐，并且无法使其工作。有没有人有任何想法如何让文字环绕jssor图像滑块？ 代码如下：如何让文字环绕jssor图像滑块？
HTML：
<div class="content">
<!-- image slider -->
<div id="slider1_container" style="position: relative; top: 0px; left: 0px; width:
800px; height: 355px; background: #c6eafb; overflow: hidden; margin-right: 2%; margin
bottom: 1.5%; z-index: -1;">
<!-- Loading Screen -->
<div u="loading" style="position: absolute; top: 0px; left: 0px;">
<div style="filter: alpha(opacity=70); opacity:0.7; position: absolute; display: block;
background-color: #000000; top: 0px; left: 0px;width: 100%;height:100%;"></div>
<div style="position: absolute; display: block; background: url(../img/loading.gif) no
repeat center center; top: 0px; left: 0px;width: 100%;height:100%;"></div>
</div>
<!-- Slides Container -->
<div u="slides" style="cursor: move; position: absolute; left: 0px; top: 0px; width:
800px; height: 356px; overflow: hidden;">
<div>
<img u="image" src="images/mombaby.jpg" />
</div>
<div>
<img u="image" src="images/baby.jpg" />
</div>
<div>
<img u="image" src="images/family.jpg" />
</div>
<div>
<img u="image" src="images/finalization.jpg" />
</div>
<div>
<img u="image" src="images/baby2.jpg" />
</div>
</div>
<!-- Arrow Left -->
<span u="arrowleft" class="jssora05l" style="width: 40px; height: 40px; top: 158px;
left: 8px;"></span>
<!-- Arrow Right -->
<span u="arrowright" class="jssora05r" style="width: 40px; height: 40px; top: 158px;
right: 8px"></span>
<!-- Arrow Navigator Skin End -->
<a style="display: none" href="http://www.jssor.com">banner slider</a>
<!-- Trigger -->
<script>
jssor_slider1_starter('slider1_container');
</script>
</div>
<!-- Jssor Slider End -->
<p class="text">Welcome to Adoption Covenant
Making the decision to adopt a child can be difficult but the process involved with
adopting doesn’t have to be. Adoption Covenant is a licensed, full service adoption
agency for both domestic and international adoption. Our goal is to place children for
adoption with loving families while simplifying and reducing the expense and heartache
commonly involved with the process. Our unique adoption services are rooted in a deep
understanding of adoption laws and our commitment to improving the lives of parentless
children around the world.
"Unless someone like you cares a whole awful lot, nothing is going to get better. Its
not."
Dr. Seuss, The Lorax
</p>
</div>
CSS：
.content {
margin-right: 3%;
margin-left: 3%;
z-index: 100;
background-color: #FFFFFF;
opacity: .85;
border-radius: 30px;
height: 365px;
padding: 1%;
}
.text {
font-family: "Open Sans", sans-serif;
font-size: 1.3em;
font-weight: 400;
color: #000066;
}
/* image slider */
/* jssor slider arrow navigator skin 05 css */
/* .jssora05l (normal)
.jssora05r (normal)
.jssora05l:hover (normal mouseover)
.jssora05r:hover (normal mouseover)
.jssora05ldn (mousedown)
.jssora05rdn (mousedown) */
.jssora05l, .jssora05r, .jssora05ldn, .jssora05rdn {
position: absolute;
cursor: pointer;
display: block;
background: url(../img/a17.png) no-repeat;
overflow:hidden;
}
.jssora05l { background-position: -10px -40px; }
.jssora05r { background-position: -70px -40px; }
.jssora05l:hover { background-position: -130px -40px; }
.jssora05r:hover { background-position: -190px -40px; }
.jssora05ldn { background-position: -250px -40px; }
.jssora05rdn { background-position: -310px -40px; }
/* image slider */