我正在使用 UIKit 开发一个页面，其中我的目录浮动在右侧，左侧的文本围绕目录（截图如下）。到目前为止，我已经成功开发了该页面。但是，我很难让这个页面响应所有设备。我希望我的目录堆叠在顶部，并且文章应该在较小设备上的下方，在大型设备上，右侧的目录和左侧的文本。以下是我正在处理的代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body>
<div class="uk-container uk-padding uk-margin-medium-bottom ">
<article class="uk-article">
<div class="uk-width-xxlarge uk-margin-auto uk-text-center">
<h1 class="uk-article-title">Security </h1>
</div>
<div class="toc uk-float-right uk-margin-left uk-margin-bottom uk-margin-top ">
<h4 style="margin:0px">
<b>Contents</b>
</h4>
<hr>
<!-- Table of content list starts from here -->
<ul class="listOfContent">
<li>
<a href="#introduction">Introduction</a>
<ul>
<a href="#overview" class="uk-scroll"><li>Overview</li></a>
</ul>
</li>
<!--Introduction finsih here -->
<li>Contents</li>
<li><a href="#infra">Infrastructure Security</a>
<ul>
<li>Datacenters
<ul>
<li>Availability and Resiliency</li>
</ul>
</li>
<li> Configuration Management
<ul>
<li>Patching Policy</li>
<li>Server Authentication</li>
</ul>
</li>
<li>Monitoring</li>
<li>Automated Scanning
<ul>
<li>Vulnerablity Scanning</li>
<li>Intrusion Detection</li>
<li>Data Leak Scanning</li>
</ul>
</li>
</ul>
</li>
<!--Infrastructure Secuirty finish here -->
<li>Data Security
<ul>
<li>Privacy</li>
<li>Data Sovereignty
<ul>
<li>Leaving the Org</li>
</ul>
<li>Support Access</li>
</li>
</ul>
</li>
<!--Data Secuirty list close here -->
<li>Web Application Secuirty
<ul>
<li>Change Management
<ul>
<li>CI/CD</li>
<li>Testing</li>
</ul>
</li>
<li>User Authentication
<ul>
<li>Password Storage</li>
<li>Password Requirements</li>
<li>Google Authentication Support
<ul>
<li>Two/Multi-factor Authentication</li>
</ul>
</li>
</ul>
</li>
<li>Encryption
<ul>
<li>HTTPS/TLS</li>
<li>Encryption in Transit</li>
<li>Encryption at Rest</li>
</ul>
</li>
</ul>
</li>
<!--Web application list finishes here -->
<li>Network Secuirty
<ul>
<li>Firewalls</li>
<li>Network Flow Monitoring</li>
</ul>
</li>
<!-- Network finsihes here -->
<li>Backups and Business Continuity</li>
<ul>
<li>Database Backups
<ul>
<li>Ppint In Time Recovery via Automated Backups</li>
<li> Cross Region Copied Snapshots</li>
</ul>
</li>
<li>Other Backups</li>
</ul>
</ul>
</div>
<!--Start of the article -->
<div class=" uk-align-center uk-flex-first@l uk-flex-first@m uk-flex-last@s ">
<div>
<span class="anchor" id="introduction"></span>
<!-- <div class="introduction"> -->
<h3 >Introduction</h3>
<p class="uk-article-lead"> This Company is a SaaS platform used to collect and analyse customer feedback and survey. development team is based in Germany<br/> <br/>
This is a collection of topics that describe how we run securely. They're intended as a high-level introduction to how we deal with security, in order to help you with your decision making process. More details are available on request - just ask your sales representative.
</p>
</div>
<!--Overview div -->
<div>
<h3>Overview</h3>
<p> As a very high-level summary:
<ul>
<li>The Company has strong application, network and infrastructure-level security controls in place to ensure your data is safely stored and processed
<br/><br/></li>
<li>Comaony serves multiple tenants from the same application codebase, but uses effective isolation techniques to keep tenant data separate
<br/><br/></li>
<li>Comopany observes privacy laws, which are broadly compatible with many other jurisdictions (for example, we support the rights of access and rectification for data subjects)
<br/>
<br/></li>
<li>Company is hosted on AWS, in multiple regions, using VPC
You'll find more information on each of these points in the detailed chapters documents below. <br/></br></li>
</ul>
</p>
</div>
<!--divider style="overflow: hidden;" -->
<hr style="overflow: hidden;">
<!-- Infrastructure Div -->
<div>
<span class="anchor" id="infra"></span>
<h3>Infrastructure Security</h3>
<h5 id="datacenters" style="margin-bottom:0px;"><b>Datacenters </b></h5>
<p>
Company's products are hosted with the world’s leading data centre provider, Amazon Web Services (AWS). Access to these datacenters is strictly controlled and monitored by 24x7 on-site security staff, biometric scanning and video surveillance.
AWS maintains multiple certifications for its data centres, including ISO 27001 compliance, PCI Certification, and SOC reports. For more information about their certification and compliance, please visit the AWS Security website and the AWS Compliance website.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</p>
</div>
<!-- </div> -->
<br/>
</div>
</article>
</div>
</body>
</html>
