html - Auto Adjusting the Size of Images and/or Icons On the Same Line -


imagine social media icons/images (e.g. facebook, twitter, linkedin) lined next each other on same line. how can make size of icons/images auto adjust when add additional icons/images line? right jump next line. want where, if add icons/images, smaller, stay on same line; if take icons/images away, larger fit width of container.

thank help!

update:

            <div class="padding"><a href="http://www.facebook.com"><img class="image" src="images/black_white_facebook.png" alt="facebook icon" /></a></div>             <div class="padding"><a href="http://www.twitter.com"><img class="image" src="images/black_white_twitter.png" alt="twitter icon" /></a></div>             <div class="padding"><a href="http://www.linkedin.com"><img class="image" src="images/black_white_linkedin.png" alt="linked in icon" /></a></div>             <div class="padding"><a href="http://www.wordpress.com"><img class="image" src="images/black_white_wordpress.png" alt="wordpress icon" /></a></div>             <div class="padding"><a href="http://www.youtube.com"><img class="image" src="images/black_white_youtube.png" alt="youtube icon" /></a></div>             <div class="padding"><a href="http://www.plus.google.com"><img class="image" src="images/black_white_google_plus.png" alt="google+ icon" /></a></div>          </div><!-- end of icons div --> 

icons {margin: 0 auto; text-align: center;}

.image {width: 150px; background-color: white; padding: 2px;}

.padding {display: inline; padding-right: 6px;}

i think should put each content: text, icon in different , put these in line width , height want


Comments

Popular posts from this blog

OpenCV OpenCL: Convert Mat to Bitmap in JNI Layer for Android -

android - org.xmlpull.v1.XmlPullParserException: expected: START_TAG {http://schemas.xmlsoap.org/soap/envelope/}Envelope -

python - How to remove the Xframe Options header in django? -