What must be done to make a HTML/PHP page to resemble a Picture in the same dimensions of the original one?

Hi Experts

What must be done to make a HTML/PHP page to resemble a Picture in the same dimensions of the original one?

The original Picture

img002
How it appears very small)

img001
Code used:
<br/><div id="container_principal">
	<div class="row font">
		<div class="col-md-12">
            <div class="col-md-3">
            <img class="img-responsive" src="<?php echo base_url('assets/img/testeira_compras-publicas_ica.png')?>" alt="ppais" title="COMPRASPUBLICAS"/>
            </div><br/><br/>
            <div class="col-md-9">
        		<h3><b>&nbsp;&nbsp;&nbsp;PPAIS - <b style="font-size:18px; font-family:'Helvetica Neue', Helvetica, Arial, sans-serif;">Programa Paulista da Agricultura de Interesse Social</b></b> </h3><hr class="hr_titulos"/>
            </div>

Open in new window


Thanks in advance!
Eduardo FuerteAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Dave BaldwinFixer of ProblemsCommented:
You would have to make it Not Responsive and probably put the width and height in the <img> tag.
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Olaf DoschkeSoftware DeveloperCommented:
A simple solution would be takling away class="img-responsive", but from the class name my guess would be it's sizing the image to be responsive and something is wrong with the setup, eg it sizes the banner down, even though the device has lots of space, so you'd surely need to dig into the css class and maybe further down the drain to see how and why it behaves this way.

What are your CSS skill levels?

Bye, Olaf.
0
Marco GasiFreelancerCommented:
It looks like you're using a template adapting it to your needs. Dave and Olaf are right saying the image must not be responsive to be displayed in its original size. But keep in mind that image stays within a column with class col-md-3 and this is the reason the image was given class img-responsive: if you make the image not responsive it will be displayed in its original size but it will exceed its container (col-md-3) limits. This could and could not have some effect on the entire layout at different resolutions depending on how the layout is built. So, if you drop the class img-responsive test carefully what happens to the entire layout resizing the browser window.
0
Eduardo FuerteAuthor Commented:
Since I'm in a hurry now .. what you pointed solved it perfectly!

Thank you for your assistance!
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
PHP

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.