putting an (extra) image in the Lightbox modal

[ifcDeveloper]

hi _
though i'm veteran HTML5 developer i'm still VERY new to Bootstrap and still feeling my way around
i'm working with lightbox and i'd like to add a small icon image at the end of the comments i'm writing in data-footer

here's an example of the code
it's to describe a video game _ i would like to add the PEGI age image in the modal details as well

<li>
	<a href="media/index/index_DarkSoulsScholar.png" data-title="Dark Souls II: Scholar of the First Sin" data-footer="The undead curse continues to spread across the kingdom of Drangleic with Dark Souls II" data-toggle="lightbox" data-gallery="XBoxOne" data-parent=".gallery-parent">
	<img src="media/XBoxOne/XBoxOne_DarkSoulsScholar_RPG.png" title="Dark Souls II: Scholar of the First Sin - Click for more..." /></a>
</li>

this is the resulting modal >> i'd like to insert a small PEGI age code icon as well
modal.jpg

any input would be greatly appreciated _ thank you

[Disconnected]

Hello!
Just a quick question, are you having the modal pop up or are you putting the modals popup itself in a col?

[ifcDeveloper]

hi : )
the modal pops up when the user clicks on an image in a gallery

[Disconnected]

Im guessing your making a gaming site?
So this could be what your looking for, the best way to do what you want is to use col-md or col-xs
Image trigger for modal

<img src="images/filler.jpg" alt="what ever it is" data-toggle="modal" data-target="#firstimage" />

The actual modal code

<div class="modal fade" id="firstimage" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
  <div class="modal-dialog" role="document">
    <!--should you need to style it-->
    <div class="modal-content" style="border-radius:0;">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Dark Souls II: Scholar of the First Sin</h4>
      </div>
      <div class="modal-body">
        <img src="images/filler.jpg" style="width:570px; height:200px;" alt="whatever it is" />
      </div>
      <div class="modal-footer" style="margin:0; padding:0;">
		<div class="row-fluid">
			<div class="col-md-10">
				<p style="text-align:left;">
				The undead curse continues to spread across the kingdom of Drangleic with Dark Souls II, No matter how many times
				you try to fill this up your going to get rekt leik a baus bruh			
				</p>
			</div>	
			<div class="col-md-2">
				<p style="text-align: center; background-color:#000; color:#FF8000;">Rating :</p>
                                <!-- your pegi image goes here -->
				<img src="http://www.pegi.info/en/index/id/33/media/img/320.gif" style="width:100%; margin-top:0;" alt="rate-3" />
			</div>
		</div>	
      </div>
    </div>
  </div>
</div>

[ifcDeveloper]

OMG!!! that is AMAZING!!! Thank you soooo much

[Disconnected]

I had to do it while i was eating, so it looks kinda sloppy but that should give you the feel of what your looking for, if you need anything else feel free to message me ill be more than happy to assist you

Also i dont know if it is something in the modals footer css or not but dont take out the text-align or else it will put everything to the right, unless your fine with that, geez im helping alot and getting all these good ideas :O

[ifcDeveloper]

you really were very kind to work through the code like that for me _ i really am very appreciative of your help
unfortunately your solution is a bit beyond my scope for right now and for all your work i'm ashamed to admit that i cannot use it right now _ tbh i thought there might be a simple data-attribute i could implement from the Lightbox code _
i REALLY don't want you to think yours was a wasted effort _ i have more than a decade web developing but looked at Bootstrap for the very first time just a few days ago as a possible solution to a medium sized commercial project i'm involved in _ we are in testing mode at the moment so i've decided to find a solution for the image problem via Photoshop instead of source code _ BUT this is only a temporary fix so that i can present to client and hopefully move to the next stage _
in the interim my few hours / days exploring Bootstrap have convinced me this is what get stuck into _ especially as version 3 is geared for smartphones _ I have already ordered all sorts of training materials with this development in mind _ so eventually your code WILL make complete sense and i WILL be back with more questions and_ who knows _ in the fullness of time some answers as well!!
o: ) Thanks again Disconnected _ MUCH APPRECIATED

[Disconnected]

It's all good, truth be told you have far more years than I, I have been interested in this type of thing since i was 13 (6 years ago) and have just started with bootstrap and i am loving how it is simple and easy to use mainly the grid layout, no need to worry about dealing with mobile devices at all, i wouldnt say it is geared to smartphones.. more like it allows compatibility for a more wider community which it really lacked prior to this version also, what kind of project are you involved in

But none the less I will begin staying in this community since no one is answering questions i feel as though it is only right that i try helping people even if my knowledge is basic, cause some help is better than none at all Dont hesitate to come looking for me should anything else arise :P