LinkBack URL
About LinkBacks
Hello,
Here is my code
I have a header image
then I have a div. Which holds 6 images in a row.
Currently I have 3 rows. the layout is good. the images are aligned properly the way I want.
But my main problem is maindiv. In IE 7 the images overflow outside the div.
I need all images to be shown inside the div.
Can someone tell me what i am doing wrong.
Code:<head> <title>Main Page</title> <style type="text/css"> .maindiv { width:700px; position:relative; margin: 0px; } .img-with-text { text-align: center; width: 100; float:left; padding:19px 19px 10px 0px; font-size:9px; font-weight:bold; } .img-with-text img { display: block; margin: 0 auto; } .leftdivtop1 { float:left; width:100px; padding:19px 0px 10px 0px; text-align:center; font-size:9px; font-weight:bold; } </style> </head> <body> <div class="maindiv"> <p><img src="images/mainheader.jpg"></p> <div class="img-with-text"> <a href="main.pdf" target="_blank"><img src="/images/main-100x125.jpg">Click here</a> </div> <div class="img-with-text"> <a href="one.pdf" target="_blank"><img src="/images/one.jpg"></a> <a href="one.pdf" target="_blank">one<br/> 1878-1883</a> </div> <div class="img-with-text"> <a href="two.pdf" target="_blank"><img src="/images/two.jpg"> two<br/> 1883-1885</a> </div> <div class="img-with-text"> <a href="03.pdf" target="_blank"><img src="/images/03.jpg"> 03<br/> 1885-1887</a> </div> <div class="img-with-text"> <a href="04.pdf" target="_blank"><img src="/images/04.jpg"> 04<br/> 1887-1889</a> </div> <div class="leftdivtop1"> <a href="05.pdf" target="_blank"><img src="/images/05.jpg"> 05<br/> 1889-1891</a> </div> <br/> <div class="img-with-text"> <a href="06.pdf" target="_blank"><img src="/images/06.jpg"> 06<br/> 1891-1894</a> </div> <div class="img-with-text"> <a href="07.pdf" target="_blank"><img src="/images/07.jpg"> 07<br/> 1894-1896</a> </div> <div class="img-with-text"> <a href="08" target="_blank"><img src="/images/08.jpg"> 08<br/> 1896-1898</a> </div> <div class="img-with-text"> <a href="09.pdf" target="_blank"><img src="/images/09.jpg"> 09<br/> 1898-1900</a> </div> <div class="img-with-text"> <a href="10.pdf" target="_blank"><img src="/images/10.jpg"> 10<br/> 1900-1903</a> </div> <div class="leftdivtop1"> <a href="11.pdf" target="_blank"><img src="/images/11.jpg"> 11<br/> 1903-1906</a> </div> <br/> <div class="img-with-text"> <a href="12.pdf" target="_blank"><img src="/images/12.jpg"> 12<br/> 1906-1909</a> </div> <div class="img-with-text"> <a href="13.pdf" target="_blank"><img src="/images/13.jpg"> 13<br/> 1909-1912</a> </div> </div> <div style="clear:both;"></div> </body> </html>
Reply With Quote
Bookmarks