В теге нижнего колонтитула, то есть, наконец, на изображении, я хочу один слева (экстренный контакт) и другой справа (онлайн-консультант) ???Как это сделать? - PullRequest
Новая
       1

В теге нижнего колонтитула, то есть, наконец, на изображении, я хочу один слева (экстренный контакт) и другой справа (онлайн-консультант) ???Как это сделать?

0 голосов
/ 25 октября 2018

At the footer, I want one at the left (Emergency Contact) and other at right 

<!Doctype html>
<html>

<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="css\font-awesome.min.css">
  <title>Welcome to Login</title>
  <link rel="stylesheet" type="text/css" href="css\style.css">
</head>

<body>
  <div class="container-fluid">
    <div class="row">
      <img class="bgimg" src="images\bg5.jpg" />
      <div class="lgform">
        <div class="lglogo col-md-12">
          <font class="col-md-6" face="Times New Roman" size="48px">MAS</font>
          <img class="logo col-md-6" src="images\logo2.png" />
        </div><br><br><br>
        <div>
          <i class="fa fa-id-card col-md-2" style="font-size:20px;color:green"></i>
          <select class="col-md-9">
            <option>Select a Document</option>
            <option>id number</option>
          </select>
        </div><br>
        <div>
          <i class="fa fa-user-o col-md-2" style="font-size:20px;color:green"></i>
          <input class="col-md-9" type="number" placeholder="Number Document" />
        </div><br>
        <div>
          <i class="fa fa-key col-md-2" style="font-size:20px;color:green"></i>
          <input class="col-md-9" type="password" placeholder="Password" />
        </div><br>
        <div>
          <center>
            <a href="index.html">
              <input class="btn btn-primary col-md-6" type="submit" value="LOGIN" style="font-weight:bold" />
            </a>
          </center>
          <center>
            <a href="registration.html">
              <br><input class="btn btn-danger col-md-6" type="submit" value="Create an Account! New User?" style="font-weight:bold" />
            </a>
          </center>
        </div><br>
        <div class="col-md-7" style="margin-left:100px">
          <a href="forgotpsw.html">¿Forgot Password?</a>
          <a href="help.html" style="float:right">¿Help?</a>
        </div><br><br>
      </div>
      <footer>
        <div class="container-fluid">
          <div class="row">
            <div class="float-left" style="position:relative">
              <p class="p1 col-lg-6">(91)+8313285202</p><br>
              <h5><i class="fa fa-phone-square col-lg-6" style="color:red">EMERGENCY CONTACT</i></h5>
            </div>
            <br><br>
            <div class="float-right" style="position:relative">
              <p class="p2 col-lg-6">(91)+MAS@GMAIL.COM</p><br>
              <h5><i class="fa fa-check col-lg-6" style="color:green">ONLINE CONSULTANT</i></h5>
              </font>
            </div>
          </div>
        </div>
      </footer>
    </div>
  </div>
</body>

</html>

1 Ответ

0 голосов
/ 25 октября 2018

Вот решение проблемы: 

<footer>
    <div class="container-fluid">
        <div class="float-left">
            <p class="p1 col-lg-6">(91)+8313285202</p>
            <br>
            <h5><i class="fa fa-phone-square col-lg-6" style="color:red">EMERGENCY CONTACT</i></h5>
        </div>

        <div class="float-right">
            <p class="p2 col-lg-6">(91)+MAS@GMAIL.COM</p>
            <br>
            <h5><i class="fa fa-check col-lg-6" style="color:green">ONLINE CONSULTANT</i></h5>
        </div>
    </div>
</footer>

Я удалил <div> с классом row, а также удалил style="position:relative из div, который использовал float-leftи float-right.

Я также исправил код немного.Вот мой Codepen, показывающий рабочий код: https://codepen.io/CodeBoyCode/pen/gBQVWR

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...