页面的一半未在移动设备上显示

时间:2015-03-16 14:19:07

标签: html css

我有following页面,其右侧的网站内容被隐藏。

请指导我为什么会这样,以及如何解决它。谢谢。

<div id="responsivearea" style="margin-top: -23px; padding-top: 90px;">
<div class="img-center"><img class="wp-image-2520 alignleft" style="margin-right: 180px;" src="http://www.inspuratesystems.com/nayajeevan/wp-content/uploads/2015/02/Meet-rabia.png" alt="good employer" width="190" height="100" /><a href="http://asiasociety.org/video/asher-hasan-spark-extinguished" target="_blank"><img id="AshersStory" class="wp-image-2521 alignleft" style="margin-right: 80px;" src="http://www.inspuratesystems.com/nayajeevan/wp-content/uploads/2015/02/Ashers-story-circle.png" alt="gift of health" width="190" height="188" /></a></div>
</div>
</div>
<p style="float: left; margin-left: 48px; font-size: 25px;">MEET RABIA</p>
<p style="float: right; margin-top: -79px; margin-right: 100px; font-size: 25px;">ASHER'S STORY</p>

<div>
<p style="float: left; margin-left: 26px; font-size: 15px; width: 200px;">Everything is hand coded and every little detail is given attention. We will go the extra mile to make your product perfect.
<a style="color: #fd685b;" href="#"><strong>LEARN MORE</strong></a></p>
<p style="float: right; margin-top: -183px; margin-right: 107px; font-size: 15px; width: 180px;">Asher was born and raised in England until the age of eleven. At that time, his father’s untimely death prompted
<a style="color: #fd685b;"http://www.inspuratesystems.com/nayajeevan/?p=3202"><strong>LEARN MORE</strong></a></p>

2 个答案:

答案 0 :(得分:2)

view-source:http://www.inspuratesystems.com/nayajeevan/?page_id=126第178行 - 您的宽度值严格为700px

例如,尝试使用max-width

第242行(600px width)

答案 1 :(得分:2)

U在px中给出宽度。这对移动设备不利,因为它们有不同的尺寸。 您应该%宽度,因此它占据屏幕的一部分,而不是精确的像素数。

目前,在您网站的多个位置,像素数量大于屏幕,这就是您无法看到元素的原因。