barkster Posted July 26, 2008 Share Posted July 26, 2008 I'm trying to float two image spacers, one to the right and one on the bottom of the div. I cannot get it to fill the size of the div and my bottom div is pushed down to the size of the image div. Can someone help me with this mess? Thanks style <style type="text/css"> #outer { } #image_container { width:2px; margin:0px auto; float:right; } #image_container img { width:2px; CURSOR:e-resize; } #bottomdiv { } </style> html <div id="outer" style="WIDTH:100%;HEIGHT:30px; border: solid 1px black"> <div id="image_container"> <img src="bluespacer.gif" border="0" height="100%"onmousedown="getDivPositionX(event)"/> </div> <div id="bottomdiv"> <img src="bluespacer.gif" border="0" width="100%" height="2px" style="CURSOR:s-resize;" onmousedown="getDivPositionY(event)"/> </div> </div> [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted July 26, 2008 Share Posted July 26, 2008 When I first read "image spacer" I thought you were coding in tables. But then I saw your code and it was 100% css. Typically, it is unnecessary to use image spacers in css since you can use padding and/or margins to achieve the same effect. Unless I misinterpreted you, I would recommend not using image spacers at all. A link, the FULL source code, and an image to show what you are trying to achieve would be necessary for me to help you completely. Quote Link to comment Share on other sites More sharing options...
barkster Posted July 26, 2008 Author Share Posted July 26, 2008 Image is there and I'll paste it into an html doc for you. You forgot to ask why I wanted an image spacer and what I'm trying to achieve... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> <style type="text/css"> #outer { } #image_container { width:2px; margin:0px auto; float:right; } #image_container img { width:2px; CURSOR:e-resize; } #bottomdiv { } </style> </head> <body> <div id="outer" style="WIDTH:100%;HEIGHT:30px; border: solid 1px black"> <div id="image_container"> <img src="bluespacer.gif" border="0" height="100%" /> </div> <div id="bottomdiv"> <img src="bluespacer.gif" border="0" width="100%" height="2px" style="CURSOR:s-resize;" /> </div> </div> </body> </html> Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted July 27, 2008 Share Posted July 27, 2008 Image is there and I'll paste it into an html doc for you. You forgot to ask why I wanted an image spacer and what I'm trying to achieve... Did you not read my post? People like yourself piss me off - I try to be nice, nice enough to help you out for free and YOU DO NOT EVEN READ MY POST! > A link, the FULL source code, and an image to show what you are trying to achieve would be necessary for me to help you completely. ... I don't care why you need a spacer. It is irrevalent to help you solve this problem. Quote Link to comment Share on other sites More sharing options...
barkster Posted July 27, 2008 Author Share Posted July 27, 2008 I've been known to piss people off, I did read your post but I misread it. I thought you were wanting the imagespacer image. Sorry. I'll try to read a bit more carefully next time. Here is what I'm trying to accomplish. The blue lines need to be images scalled to fit the div. I set the height on the right div to 100% but the divs are not sizing right, the right one expands past the container. [attachment deleted by admin] Quote Link to comment Share on other sites More sharing options...
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.