I can’t say I understand how bootstrap needs things to be, but the HTML looks off to me. It could be enough to cause some problems. eg.
<a href="index.php"><img src="images/logo.png" id="ii" class="ii"class="img-responsive"></img></a>
<marquee><p style="color:orange;"> Site best viewed in chrome,Internet Explorer and Firefox</p></marquee>
AFAIK
There should be a space between attribute values and another attribute.
the "ii"class
The img tag is an “empty” element
Must have a start tag and must not have an end tag.
I don’t think this would cause the problem you’re describing but the marquee tag is obsolete.
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.
At least post the html that is the result of the php, rather than the actual php code.
But looking at it, there are multiple validation errors, so it’s not surprising that there are variations between browsers. Browsers are good at interpreting broken code, but they each may do it differently.
Nowhere in your html/php do I see an element with the attribute id="image"
In addition to the lack of space between the attributes and the redundant closing </img> tag, do not use multiple class attributes on an element. If you want to apply more than one class, put them within a single class attribute separated by a space.
That snippet of code will work fine on an iPad or in fact almost any device created this century.
Note that the css you posted will center 1 image on a line. It will not center multiple images on the same line. For example your social images would need to be centred like this:
Your problem lies somewhere else but without a link to the live site or at least a working demo it will be hard to diagnose.
It may well be that an error in the html could also be a cause but all we can do is to suggest things rather than giving a definitive answer. I can tell you that we could advise the problem more or less straight away if we could see the page in question
Mitttenague has already pointed out some errors in the html but there are indeed many more and any of which could cause unexpected results as it will be down to the browsers to determine how to interpret the invalid code as best it can.
You have elements with two class attributes applied but only one is allowed.
You have malformed html. This is just one instance.
<form action="knowmore.php" method="post">
</div>
That closing div cannot exist in that position as it shuld either be before the form element or around the closing form tag.
e.g.
<div>
<form action="knowmore.php" method="post">
<!-- form content here -->
</form>
</div>
A single misplaced opening or closing tag can completely destroy a whole page depending on the structure.
Therefore it is very important to validate your html regularly just to check for broken tags or typos. Not all errors or warnings have the same importance and some will cause no problem while others will break the whole thing,
As an aside and just for extra (unsolicited) info please note that for best coding practices you should never see this in a web page.
</div>
<br>
<br>
<br>
Breaks are never used just to make space. They are line breaks between sentences such as in poems or addresses or between form elements. They should not be used for paragraph ends or simply to create new lines when you want extra space. (Historically browsers may ignore multiple breaks when placed together and indeed are allowed to ignore breaks when they occur immediately after an opening tag or immediately before a closing tag.)
Note that indeed any of the above comments may in fact have nothing to do with the problem in hand
