CSS相对定位不起作用 [英] CSS Relative Positioning Not Working

问题描述

出于某种原因，我无法让自己的图像位于Twitter Feed的右侧。我把它定位在twitter feed的DIV标签中，但仍然在下面。以下是实时链接： http://www.lymemd.org/indexmm6.php

我的CSS：

  #twitterfeed {
 position：relative ; 
} 
 
 #drshow {
 position：relative; 
 left：200px; 
} 
  

我的HTML：

 < div id =twitterfeed> 
< a class =twitter-timelinewidth =460height =250href =https://twitter.com/Lyme_MD
 data-widget-id =453198382664667137 >通过@ Lyme_MD推文< / a> < script>！function（d，s，id）{var js，fjs = d.getElementsByTagName（s [0]，p = / ^ http：/。test（d.location）？'http'：'https' ; if（！d.getElementById（id））{js = d.createElement（s）; js.id = id; js.src = p +：//platform.twitter.com/widgets.js; fjs.parentNode .insertBefore（js，fjs）;}}（document，script，twitter-wjs）;< / script> 
 
< div id =drshow> 
< img src =images / drshow.gifalt =Diane Rehm显示图片width =169height =145> 
< / div> 
 
 < / div> 
  

解决方案

> display：inline-block 似乎可以解决它：

  #drshow {position：relative; display ：inline-block} 
  

For some reason I cannot get my image to position to the right of the Twitter feed. I positioned it relatively within the DIV tags of the twitter feed, but it remains below. Here is the live link: http://www.lymemd.org/indexmm6.php

My CSS:

#twitterfeed {
    position: relative;
}

#drshow {
    position: relative;
    left: 200px;
}

My HTML:

<div id="twitterfeed">
<a class="twitter-timeline" width="460" height="250"  href="https://twitter.com/Lyme_MD" 
data-widget-id="453198382664667137">Tweets by @Lyme_MD</a> <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s); js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

<div id="drshow">
<img src="images/drshow.gif" alt="Diane Rehm Show Image" width="169" height="145">
</div>

</div>

解决方案

Adding display:inline-block seems to fix it:

#drshow { position: relative; display:inline-block }

这篇关于CSS相对定位不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！