Lisa23 Posted October 17, 2011 Share Posted October 17, 2011 Hi i am trying to have image with scroll bar i do not want to set the size of div inside because if i set a size the scroll bar will just scroll empty space so i am trying to set size 100% so it sets automatically but with the div with 100% scroll bar doesnt show. help please <div style="background-color:red; width:300px; height:200px; overflow:scroll; overflow-x: scroll; overflow-y: hidden;"> <div style="width:100%;"> <div class="img"> <a target="_blank" href="klematis_big.htm"><img src="klematis_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis4_big.htm"><img src="klematis4_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> </div> </div> Quote Link to comment Share on other sites More sharing options...
sunfighter Posted October 19, 2011 Share Posted October 19, 2011 Not completely sure what you mean, but take a look at this and see if it's close: <style type="text/css"> .img { border: green solid 1px; //width: 300px; float:left; } </style> <body> <div style="background-color:red; width:300px; height:200px; overflow:scroll; overflow-y: scroll; overflow-y: hidden;"> <div style="width:3000px;"> <div style="width:100%;"> <div class="img"> <a target="_blank" href="klematis_big.htm"><img src="klematis_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis2_big.htm"><img src="klematis2_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> <div class="img"> <a target="_blank" href="klematis4_big.htm"><img src="klematis4_small.jpg" alt="Klematis" width="110" height="90" /></a> <div class="desc">Add a description of the image here</div> </div> </div> </div> </div> </body> Quote Link to comment Share on other sites More sharing options...
Lisa23 Posted October 30, 2011 Author Share Posted October 30, 2011 Hi that didnt work the images goes under if more than the width Quote Link to comment Share on other sites More sharing options...
AyKay47 Posted October 30, 2011 Share Posted October 30, 2011 I do not understand your explanation. Can you please expand and be a little more clear on what exactly it is that you are trying to do here.. Quote Link to comment Share on other sites More sharing options...
Lisa23 Posted October 30, 2011 Author Share Posted October 30, 2011 Hi actually it is working i didnt put (px) on the width is working thanks 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.