socken 0 Posted January 30, 2006 Report Share Posted January 30, 2006 Hi everyone! I have some problems with an iframe:on the left side of my page, I have a menu:#menu{ float: left; width: 200px; margin-top: 0; padding-top: 0;}On the right side, I want an IFRAME which loads external pages. Now my Problem:If I set the width of the iframe to 100%, i goes underneath my menu, which I don't want. If I don't set the width, or set it to auto, it is very small. How do I set the Iframe width so it stays on the right hand side of the menu, but uses it's maximum space available???Thanks for any help!! Quote Link to post Share on other sites
socken 0 Posted January 30, 2006 Author Report Share Posted January 30, 2006 OK, I think I figured that one out! I just put the iframe in a div, and set the margin-left of that div to a fixed value. If I then set the width-value of the iframe to 100%, it only takes the space it has..Now my next problem: (not quite shure if this still fits here...)How can I adjust the height of the iframe!? It should take as much space as it needs, so no scollbars should be visible. Quote Link to post Share on other sites
socken 0 Posted January 30, 2006 Author Report Share Posted January 30, 2006 Continuying my monologe ;-)My solution does work, but like always : NOT IN IE!!!Doesn't IE undestand the margin-left tag!? Or do I have to set an additional align tag or something!? Please help me on this... Quote Link to post Share on other sites
aspnetguy 30 Posted January 30, 2006 Report Share Posted January 30, 2006 IE should take the margin-left.Post the code for the entire page. Quote Link to post Share on other sites
socken 0 Posted January 31, 2006 Author Report Share Posted January 31, 2006 This is my css so far... Don't laugh at the style, it's certainly not going to stay like this #body { margin-left: 0; padding: 0; max-width: 95%;}#header { margin: 5px; padding: 10px 5px 10px 5px; border: 1px dotted blue; font-size: xx-large;}#menu{ float: left; width: 230px; margin-left: 5px; padding-top: 0;}#navigation { font-family: Verdana, Helvetica, Arial, sans-serif; font-weight: bold; width: 12em; padding: 0; background-color: #fafa28; margin-bottom: 10px;}#navigation ul { list-style: none; margin: 0; padding: 0; border-bottom: 1px solid black;}#navigation ul li { margin: 0; border-top: 1px solid black; border-left: 5px solid black; border-right: 1px solid black;}#navigation ul li a:link, #navigation ul li a:visited { display: block; padding: 5px 2px 5px 0.5em; color: black; text-decoration: none; width: 100%; }#navigation ul li a:hover { display: block; padding: 5px 2px 5px 0.5em; color: black; text-decoration: none; width: 100%; border-left: 10px solid black;}#rightSide { margin-left: 250px; left: 250px; margin-top: 0; padding-top: 0; height: 100%; max-width: 95%;}#subheader { border: 1px dotted blue; padding: 10px 5px 10px 5px;}#rightSide iframe{ width: 100%; height: 100%; border: 0; overflow: visible; margin-top: 10px;}#footer{ clear: both; width: 100%; border: thin dotted #0000FF; margin-top: 20px; padding: 5px;} and here are the important parts of the html: <div id="header">HEADER</div><div id="menu"> <div id="navigation"> <ul> <li><a href="http://www.google.ch>google</a></li> </ul> </div> <div id="navigation"> <ul> <li><a href="http://www.google.ch" target="content">Google</a></li> </ul> </div> <div id="navigation"> </div></div><div id="rightSide"> <div id="subheader"> SUBHEADER </div> <iframe src="http://www.google.ch" name="content" id="content"> frame </iframe> </div><div id="footer"> footer </div> Quote Link to post Share on other sites
aspnetguy 30 Posted January 31, 2006 Report Share Posted January 31, 2006 I looked at the code in IE6 and FF and it is aligned the same on the left. I am not sure what you are seeing...maybe post a screen shot of what you are seeing.Also the iframe only gets scrollbars when the frame is resized smaller than the content of the google page....this is normal...it is supposed to do that. Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.