Серьезные проблемы с сеткой CSS

Question

Серьезные проблемы с сеткой CSS

DSM имеет принятый ответ, но в этом ответе немного ошибочно (я не уверен, что ответ когда-либо работал в готовом виде). Вот пример, который работает с текущей версией pandas (0.23.4 с 8/2018):

import pandas as pd

df = pd.DataFrame({'col1': [1, 2, 2, 3, 1],
            'col2': ['negative', 'positive', 'neutral', 'neutral', 'positive']})

conversion_dict = {'negative': -1, 'neutral': 0, 'positive': 1}
df['converted_column'] = df['col2'].replace(conversion_dict)

print(df.head())

Вы увидите, что это выглядит так:

   col1      col2  converted_column
0     1  negative                -1
1     2  positive                 1
2     2   neutral                 0
3     3   neutral                 0
4     1  positive                 1

Документы для pandas.DataFrame.replace здесь .

1

html css css-grid

задан hackerNuB 5 March 2019 в 17:10

1 ответ

score 0 · Answer 1

Например, я настроил отображение .wrapper на блокировку и использовал 2 встроенных блока для создания блоков и добавления поля. Вам просто нужно отрегулировать другие части, в которых вы использовали свойства сетки до

[112 ]

.wrapper {
  display: block;
  grid-template-columns: 0.9fr 1.1fr;
  grid-template-rows: 1.1fr 1.8fr 0.1fr;
  grid-template-areas: "header header" "content content" "footer footer";
  grid-column-gap: 1em;
  grid-row-gap: 1em;
  background-color: #fff;
}

.wrapper>div {
  padding: 1em;
}

.mainheader {
  grid-area: header;
  width: 70%;
  background-color: #fff;
}

.content {
  /*grid-area: content;*/
  width: 100%;
  font-family: Trebuchet MS;
  background-color: #fff;
  color: #000;
}
.content section {
width: calc(50% - 10px);/*for margin*/
display: inline-block;
vertical-align: top;
margin: 0px 3px;
}

.mainfooter {
  grid-area: footer;
  background-color: #854242;
  width: 40%;
  border-radius: 25px;
  padding: 20px;
  width: 800px;
  height: 30px;
  li {
    display: inline;
  }
  #h1,
  h2 {
    color: #854242
  }
  #content {}
  #footer1 {
    background-color: #999999
  }
  #footer2 {
    background-color: #999999
  }

<body>

   <div class="wrapper">
    <div class="mainheader">
      <header>

        <h1>Webbutveckling för mobila enheter</h1>
        <h2>Responsiv webbdesign</h2>

        <img src="images/header.jpg" alt="Header-bild" width="960px" />

        <nav id="mainmenu">
          <ul>
            <li><a href="index.htm" title="Startsidan">Startsidan</a></li>
            <li><a href="#" title="Sida två">Sida 2</a></li>
            <li><a href="#" title="Sida tre">Sida 3</a></li>
            <li><a href="#" title="Sida fyra">Sida 4</a></li>
            <li><a href="http://www.miun.se" title="Mittuniversitetet">Miun</a></li>
          </ul>
        </nav>

        <div id="search">
          <form>
            <input type="text" name="searchstring" id="searchstring">
            <input type="submit" value="Sök" id="searchbutton">
          </form>
        </div>
        <!-- Slut på search -->

      </header>
    </div>

    <div class="content">
      <section>
        <h2>Box 1</h2>
        <p>
          Mauris dapibus consectetur neque commodo eleifend. Pellentesque interdum posuere mollis. Nunc dui libero, feugiat sed consectetur ac, eleifend fermentum nisl. Praesent felis ligula, interdum sit amet tortor in, eleifend vestibulum mi. Duis eu ultricies
          enim. Quisque blandit ligula vel odio adipiscing, et consectetur odio vestibulum. Nam sed lectus vulputate, posuere orci sit amet, eleifend massa. Nullam mi ante, faucibus vitae turpis sed, volutpat auctor orci.
        </p>
        <p>
          Aenean varius, sapien sed pharetra gravida, massa massa sodales mi, eu venenatis quam nunc sit amet ante. Praesent bibendum massa enim, vitae pulvinar odio imperdiet sed. Nam ac lacus ac nulla mollis blandit eu quis lectus. Nullam non tortor vel ipsum
          consectetur lacinia eget non nisi. Aliquam erat volutpat. Pellentesque eget dui bibendum, malesuada quam quis, consequat lacus. Ut tincidunt pharetra laoreet. Nullam sed sem et mauris luctus ullamcorper. Mauris ipsum velit, tincidunt eget quam
          convallis, cursus suscipit ante. Vivamus vitae massa id lorem interdum hendrerit. Duis suscipit elit eu tempor tincidunt. Suspendisse ut metus id magna aliquam posuere. Duis vulputate sit amet ipsum vel egestas. Ut rhoncus elementum augue.
        </p>
        <footer id="footer1">
          <p>
            Denna sektion är från start till vänster, sedan ovanpå.
          </p>
        </footer>
      </section>

      <section>
        <h2>Box 2</h2>
        <p>
          Vestibulum mollis mattis risus, feugiat iaculis massa suscipit vel. Aenean ultricies lorem nec dui pulvinar, quis scelerisque enim egestas. Morbi massa eros, tempus id dictum eget, facilisis lobortis arcu. Nulla ut blandit nunc, ut egestas massa. Duis
          a lorem et lorem commodo dictum nec a libero. Donec porta lectus a accumsan rhoncus. Nunc vitae est id tellus suscipit malesuada. Aenean eu arcu et quam laoreet auctor ac ut sapien. Fusce sed ligula quis felis vehicula tempor sed ut libero.
          Vestibulum hendrerit id libero eget dictum. Nulla augue erat, fringilla eget imperdiet non, sagittis vitae arcu.
        </p>

        <footer id="footer2">
          <p>
            Denna sektion är från start till höger, sedan under.
          </p>

        </footer>

      </section>
    </div>


    <div class="mainfooter">
      <footer>
        <p>Sidfot - Webbutveckling för mobila enheter</p>
      </footer>
    </div>

  </div>
</body>

0

ответ дан pavelbere 5 March 2019 в 17:10

Серьезные проблемы с сеткой CSS

1 ответ

Похожие вопросы: