简体   繁体   中英

How do I position an image just to the right of an unordered list?

Well, maybe with a little offset, but if I use align="right" then it goes all the way to the right of the page. I'd like something like

- List item one                  ---------
 - List item two                  | image |
 - List item three                |       |
 - List item with a longer text   ---------

Try this...

ul { 
  float:left;
  width:(width you choose);
}

img {
  float:left;
  margin-left:5px(or however far away you want it);
  width:(width);
  height:(height);
}
<style>
  #list {
    float: left;
  }
  #list_image {
    float: left;
    margin-left: 40px;
  }
</style>
<ul id="list">
  <li>List item one</li>
  <li>List item two</li>
  <li>List item three</li>
  <li>List item with a longer text</li>
</ul>
<img src="http://www.google.com/images/logos/ps_logo2.png" id="list_image" />

Preview : here

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