July 26, 200818 yr Hiya, Why won't these DIV's align next to eachother???? driving me crazy!! ARGHHHHH <div class="wrapper"> <div class="topwrapper"> <div class="banner"><img src="Untitled-1.jpg" /></div> <div class="bannertwo"><img src="banner2.jpg" /></div></div> </div> .wrapper { height: 700px; width: 800px; } .topwrapper { height: 121px; width: 800px; } .banner { float: left; height: 121px; width: 300px; } .bannertwo { float: left; height: 121px; width: 308px; }
July 26, 200818 yr are your jpgs the same width you have set your div to? because if they are not the will overlap and cause them to not sit next to each other but in some browsers appear overlapping and in others one under another.
July 26, 200818 yr yeah sorry the banner div's I just tried your code and it wotked with two images I used, check the width of your images or alter your html to <div class="banner"><img src="Untitled-1.jpg" width="300px" /> Or alter your css and incorporate a background image Pat
July 26, 200818 yr Author I just tried your code and it wotked with two images I used, check the width of your images or alter your html to <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta name="description" content="" /> <meta name="keywords" content=" /> <meta name="copyright" content="Copyright © 2008 " /> <meta name="author" content="Michelle Hilbery" /> <meta name="design" content=" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"/> </head> <body><body onload="MM_preloadImages('images/aboutusover.png','file|images/galleryover.png','file|images/contact-usover.png','images/Homeover.png')"> <div id="wrapper"> <div class="banner"><img src="untitled-1.jpg" width="300px" height="121" /></div> <div class="bannertwo"><img src="banner2.jpg" width="308px" height="121" /></div> </div> </body> </html> .wrapper { height: 700px; width: 800px; } .topwrapper { height: 121px; width: 800px; } .banner { float: left; height: 121px; width: 300px; } .bannertwo { float: left; height: 121px; width: 308px; display:inline; } I'm stubbed!!???!!!???!!!???!!!??? Can't be that hard surley... what am i missing??? Even tried using a background image but still won't budge...
July 26, 200818 yr Author FOUND IT!!!!!!!!!!!! <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"/> didn't have the style sheet in the correct folder.... Thanks v much for you help guys
July 27, 200818 yr I knew there wasn't anything wrong with the code itself as it all worked fine for me when I copied and tested it. I am happy you were able to solve it
Create an account or sign in to comment