HTML/CSS位置元素

我正在尝试这样做：

我的是这样的：

不是最美的东西。 我的问题是：

我们有一个标题与标志，搜索栏，菜单和一个按钮。如何将它们全部内联堆叠

在有背景图片的div上-我如何定位像原始站点中的标题一样的标题 1） 请看一下文档。如果正确实现，项目应该已经内联。可以使用navbar left和navbar right类在navbar中定位项目

2） 您会注意到，较大的中间文本从与导航栏徽标相同的位置开始。这是因为container类。我建议您分析一些，看看如何正确实现容器

---

在此之后，如果您仍在努力将styles.css添加到您的pastebin帖子中，或者更好地创建一个-这将允许其他人提供更多帮助。

1-您可以编写float:left；或者浮动：对？找这个

---

2-对于定位元素，您必须稍后在“创建绝对div.”内创建相对div。。您可以使用右上角和左下角指定沉降坐标。。看这里

我想说浮动不是一种好的使用方法。除非你真的别无选择

但根据我的看法。 使用flex是可以实现的

在主div上放置一个display:flex 那么你的其他元素呢。使用display:flex-grow

使用flex是有利的，这不仅能解决你的问题。它使你的网站反应迅速

干杯

[！[如果您需要在一行中显示所有导航项目。您必须为导航设置显示：内联块。
[![if you need all navigation item in one line. you have to make display:inline-block,for navigation.

change your code to:

<div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 nav-wrap">
                <ul class="pull-left"><li><a href="#" class="logo"></a></li>
                </ul>
                <ul class="pull-left">                  
                    <li class="formSearch">
                        <input type="text" placeholder="Find Freelancers" id="searchButton">
                    </li>               
                    <li><a href="#">Browse</a></li>
                    <li><a href="#">How it works</a></li>
                </ul>
                <ul class="pull-right">
                    <li>
                        <a href="#" class="signupHover">
                            <span class="icon signup"></span>
                            <a href="#">Sign Up
                            </a>
                        </a>
                    </li>
                    <li>
                        <a href="#" class="loginHover">
                            <span class="icon login"></span>
                            <a href="#">Login</a>
                        </a>
                    </li>
                </ul>
                <button type="button" id="buttonHeader">Become a freelancer</button>
            </div>

/*add below css*/

.nav-wrap ul li{display:inline-block;}][1]][1]

将代码更改为：














成为自由职业者
/*添加以下css*/
.nav wrap ul li{显示：内联块；}][1][1]

---

这是我的代码：-html-cssplzz添加您的代码我在下面的评论中添加了它。无法查看图像URL将您的代码添加到您的问题中，而不是添加到评论中。也可以查看此页面：