can you group multiple images in a div

Question

Example given below

 <div id="SocialMediaBadges">

    <a href="http://www.facebook.com/liftedattire">
        <img src="facebook.png"/>
    </a>
    <a href="http://www.twitter.com/liftedattire">
        <img src="twitter.png"/>
    </a>
    <a href="http://www.instagram.com/liftedattire">
        <img src="instagram.pdf"/>
    </a>

</div>

and then have css align them up with something like this? I've tried the code but unfortunately, it didn't work. I can code them individually but this seemed a lot more efficient.

#SocialMediaBadges {
   float:left;
   width:120px;
   height:90px;
   margin:5px; 
}

Use `#SocialMediaBadges a { ... }` to apply the CSS properties to the `a` elements that are descendants of the tag with _id_ `SocialMediaBadges` — andyb, Jan 27 '14 at 09:05

Itay Gal · Accepted Answer · 2014-01-27T09:17:12.373

1

Try this:

#SocialMediaBadges img{
    float:left;
    width:120px;
    height:90px;
    margin:5px; 
}

Working example

Note: if you want to address an element inside an element you can do it by appending elements in the css rule.

For example #id_name div p a will address all the links that are inside a p element nested in div element that also nested in element with id = id_name

edited Jan 27 '14 at 09:17

answered Jan 27 '14 at 09:02

Itay Gal

10,706
6
36
75

Thanks! I wasn't aware that you had to "img" when calling images within a div. Thanks again!! – Jan 27 '14 at 09:12
i def will in 1 minute, so I am assuming that is the rule when calling all images within a div? Sorry, I am an amateur. – Jan 27 '14 at 09:14
I added an explanation in my answer. – Itay Gal Jan 27 '14 at 09:17
omg forgot all about that!! thanks again for the help! keep it up! – Jan 27 '14 at 09:27

score 1 · Answer 2 · answered Jan 27 '14 at 09:04

1

try this

#SocialMediaBadges a img{
    float:left;
    width:120px;
    height:90px;
    margin:5px; 
}

also you cant put pdf in html <img src="instagram.pdf"/>

answered Jan 27 '14 at 09:04

saman khademi

822
1
6
13

lol, ops!! That's just how the file downloaded from the instagram website, thanks tho!! – Jan 27 '14 at 09:12

score 0 · Answer 3 · answered Jan 27 '14 at 18:53

0

img can be nested inside div
the next HTML elements can be nested inside div element

answered Jan 27 '14 at 18:53

Daniel

379
2
6

can you group multiple images in a div

3 Answers3