不同的显示器/分辨率，不同的布局答案

【问题标题】：Different monitor/resolution, different layout不同的显示器/分辨率，不同的布局
【发布时间】：2017-09-12 17:50:39
【问题描述】：

我在网站上有这个标志，它位于导航栏菜单之间的中心。

这是一张图片：

问题是，当我切换到不同的显示器或分辨率时，徽标会移动。难道我做错了什么？如何使其在不同分辨率之间固定。

这是html代码：

<main class="site-main">
	<center><img src="img/corelogo.png" alt="Post" height="180" width="180" style="position: absolute; top: -1px; left: 570px; margin: 0 auto;"></center>
        <section class="hero_area">
            <div class="hero_content">
                <div class="container">
                    <div class="row">
                        <div class="col-sm-12">
							<br>
							<br>
							<br>
							<br>
							<br>
							<br>
							<br>
                            <h1>TeamSpan Global Solutions</h1>
                            <h2>Your partner in building satellite workforce teams.</h2>
                        </div>
                    </div>
                </div>
            </div>
        </section>

【问题讨论】：

标签： html navbar resolution fixed

【解决方案1】：

首先，中心标签已被弃用。其次，您将它定位在第一个定位（非静态）祖先元素的右边缘左侧 570 像素处。我看不到您的课程应用了哪些样式，所以我看不到那会是什么。但它肯定会根据分辨率移动。

【讨论】：

【解决方案2】：

您是否听说过响应式设计？看，你也必须发布你的CSS！ jsfiddle上可以写吗？

一些例子：

https:// codepen.io/bootstrapped/pen/dGPZvR (remove space)
https://www.bootply.com/mQh8DyRfWY
https:// codepen.io/davidcochran/pen/Fkwys (remove space)

【讨论】：