0
В настоящее время я пытаюсь понять, почему мой макет обрезается справа, когда он просматривается на iPad (эмулятор XCode) в альбомной ориентации. Вот что лишнее: даже когда я удаляю все css из макета, я все равно сталкиваюсь с той же проблемой. Я думаю, что это что-то делать с моими настройками видовых или что-то еще в моем главном файле макета:Ipad отключает текст в ландшафтном режиме Даже без использования CSS
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1,user-scalable=no,maximum-scale=1.0">
<title>MyCV - Levi Hackwith</title>
<link rel = "stylesheet" href = "/public/assets/css/app.css" />
<link rel = "stylesheet" href = "//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" />
</head>
<body>
<div id = "app">
{{{body}}}
</div>
</body>
</html>
А вот разметка для основного содержания:
<section id = "sidebar">
<section class = "contact-info">
<div class = "avatar">
<img src = "https://www.gravatar.com/avatar/{{item.gravatar}}
?s=400">
</div>
<hr />
<ul>
<li>
<span class = "label">Name</span>
<span>
{{item.firstName}} {{item.lastName}}
</span>
</li>
<li>
<span class = "label">Email</span>
<span>
{{item.email}}
</span>
</li>
<li>
<span class = "label">Location</span>
<span>
{{item.addresses.home.city}},
{{item.addresses.home.state}}
</span>
</li>
{{#if item.sites.length}}
<li>
{{#each item.sites}}
<a href = "{{this.url}}" target = "_blank">
<i class ="fa-icon {{this.icon}} fa"> </i>
</a>
{{/each}}
</li>
{{/if}}
</ul>
</section>
</section>
<section id = "main-content">
{{#each item.workHistory}}
<div class = "work-history-item">
<div class = "company-info">
<span class = "company-name">{{name}}</span>
<time datetime= "{{startDate}}">
{{#formatDate startDate 'MMMM YYYY'}}{{/formatDate}} -
{{#if endDate}}
{{#formatDate endDate 'MMMM YYYY'}}{{/formatDate}}
{{else}}
Present
{{/if}}
</time>
</div>
<div>
<div>
<p class = "work-description">
{{description}}
</p>
</div>
</div>
<div class = "skill-list">
{{#each skills}}
<span class = "label">{{this.name}}</span>
{{/each}}
</div>
</div>
{{/each}}
</section>
Живое демо из приложение можно найти здесь: http://digitalresume.herokuapp.com/users/54530e03c575dc86d61d22f8
Для того, чтобы увидеть эту проблему, вам нужно снять css с помощью инструментов dev.
Вы пробовали тестировать его без мета-тегов для мобильных устройств, чтобы увидеть, есть ли там конфликт? У вас есть живой код где-нибудь, на что я могу взглянуть? – Patrick
Я добавил прямую ссылку. Когда я удаляю метатеги, проблема все еще сохраняется. –
У меня нет xcode, потому что я нахожусь в Windows, но я просто открыл его в своем iPad и отлично его обрабатывает (это первый iPad) , Ваш портрет растянут на всю высоту, и ваши метки слегка перекрываются. Однако нет обрезанного текста. Надеюсь, это означает, что в вашем эмуляторе что-то совсем не так. – Patrick