我需要让我的p-tag进入新的界限,任何知道的人?

时间:2017-02-21 14:07:52

标签: html

所以,我正在制作这个我遇到问题的网站。如你所见,这有点奇怪。我希望数字2在下一行,但我不知道如何。

看起来,当我输入<br>标签时,一切都会下降,但是当我没有<br>标签时,它就会起作用。请帮忙。

&#13;
&#13;
body{
  margin: 0;
  padding: 0;
  font-family: 'Verdana', sherif;
}

.nav{
  background-color: #ffffff;
  color: #000000;
  list-style: none;
  text-align: center;
  padding: 20px 0 20px 0;
  border-top: solid 2px #f0f0f0;
  border-bottom: solid 2px #f0f0f0;
  margin: 0px;
}

.nav > li{
  display: inline-block;
  padding: 0 25px 0 25px;
}

.nav >li >a{
  text-decoration: none;
  color: black;
}

.nav >li > a:hover{
  color: grey;
}

.button {
  background-color: black;
  color: white;
  border: 1px solid #d9d9d9;
  border-radius: 1px;
  padding: 10px;
}

.button:hover {
  background-color: orange;
  color: black;
}

.text {
  color: black;
  text-decoration: none;
}
&#13;
<html>

  <head>
    <meta charset="utf-8">
    <title>Appetitten Pizza & Grill | Pizza</title>
    <link rel="stylesheet" href="css2.css">
  </head>

  <body>

    <center>

      <div style="width:70%">

        <div style="float:center; margin-bottom:0px">
          <a href="forside.html"><img src="something-logo.png"></a>
        </div>

        <div style="margin-top:0px">
          <ul class="nav" style="margin-bottom:0px">
            <li><a href="pizza.html"><font size="5">Some thing</font></a></li>
            <li><a href="hamburger.html"><font size="5">Some thing</font></a></li>
            <li><a href="kebab.html"><font size="5">Some thing</font></a></li>
            <li><a href="salater.html"><font size="5">Some thing</font></a></li>
            <li><a href="om-oss.html"><font size="5">Some thing</font></a></li>
          </ul>
        </div>

        <div style="width:70%;float:center">

          <div style="width:100%; float:center">
            <div style="float:center; width:100%">
              <div style="float:left; width:10%">
                <p><strong>Nr:</strong></p>
              </div>
              <div style="float:left; width:75%">
                <p align="left"><strong>Some thing:</strong></p>
              </div>
              <div style="float:left; width:15%">
                <p><strong>Price:</strong></p>
              </div>
            </div>
          </div>

          <div style="width:100%; float:center">
            <div style="float:center; width:100%">
              <div style="float:left; width:10%">
                <p>1.</p>
              </div>
              <div style="float:left; width:75%">
                <p align="left"><strong>Thing:</strong><br>(here is going to be some ingrediants)</p>
              </div>
              <div style="float:left; width:15%">
                <p>10 $</p>
              </div>
            </div>
          </div>
          
          <div style="width:100%; float:center">
            <div style="float:center; width:100%">
              <div style="float:left; width:10%">
                <p>2.</p>
              </div>
              <div style="float:left; width:75%">
                <p align="left"><strong>Thing:</strong><br>(here is going to be some ingrediants)</p>
              </div>
              <div style="float:left; width:15%">
                <p>10 $</p>
              </div>
            </div>
          </div>
         </div>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

<p>标记

上方添加此div标记
<div class="NL"></div>

和你的css文件中的这个css行

.NL
{
clear:both;
}