How to overlay Iframe on menu bar

Question

I'm new to HTML,CSS and IFrame. Now my webpage contains menu bar on top of which I need to paste a weather plugin. Now the menu bar is done using tag. I need to paste the weather plugin on this menu bar. I used the tag to source the file that generates the image of current weather status.

So the image is generated on a html file. I need to paste this image on the menu bar. I did use tag to paste it. But when I used it the menu bar shifts downwards. How can I paste it on the menu bar without the menu bar shifting.

Answer 1

Try setting the iframe to display: inline, which is a css property. if you dont have a stylesheet set up or not sure too much about css just add this attribute to your iframe tag: style="display: inline" which will apply that styling to the element.

The way elements are arranged visually on a document depends on their display property; which are mainly inline or block - block being the default of the iframe which will cause the pushing.

Answer 2

Try Give

CSS{ position:absolute; z-index:999; top:20px; right:30px}

Top and right value you can change according to your Requirements

You will have a menu bar container give position:relative to that container