简体   繁体   中英

How to align text next to a div?

Is it possible when using css to make text align right next to a div. I'm not sure how to explain it so here is an example of what i would like. Thanks.

    DIV TAG text text text text
    DIV TAG text text text text
    DIV TAG text text text text
    text text text text text
    text text text text text
    text text text text text
    text text text text text

 #article { width: 200px; } #floating { float: left; width: 80px; height: 80px; background-color: #f00; margin: 0 10px 10px 0; } 
 <p id="article"> <div id="floating">&nbsp;</div> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. </p> 

 .inl { display: inline; width: 100px; height: 20px; border: 2px solid red; } 
 <div class='inl'>div</div> text text text text<br/> <div class='inl'>div</div> text text text text<br/> <div class='inl'>div</div> text text text text<br/> text text text text text<br/> text text text text text<br/> text text text text text<br/> text text text text text<br/> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM