Question

我跟着http://www.undefinednull.com/2013/10/15/octopress-blog-tweaks-adding-author-information-section-below-each-posts/，奇怪的部分是他的CSS代码工作，并将文本旁边的文本对齐浮动。

虽然在我的情况下，我得到如下所示：

如您所见，由于原始源代码似乎已经堆积，因此文本没有以正确的方式定向。我在同一个地方投入了大量资金，并在https://github.com/shidhincr/shidhincr.github.com/blob/source/source/_includes/custom/aboutauthor.html使用CSS https://github.com/shidhincr/shidhincr.github.com/blob/source/sass/custom/_styles.scss在Github上找到了他的CSS存储库。

我得到了精确布局的模仿版本，但无法缩进图片旁边的文字，因为它在下面显示如下：

我已经尝试了所有这些，这里是我正在使用的完整的scss来源：

布局为.html

<div class="about">
     <span class="about-image">
          <img alt="shritam" src="/images/author.jpg">
     </span>
     <span class="about-desc">
          <span style="float:right;">
              <em>Hello. Welcome to pwntoken. I am an Information Security Analyst cum Penetration Tester. I do Application Security and here's my <a target="_blank" href="https://www.linkedin.com/in/shritambhowmick"> LinkedIn </a> for a professional touch. Feel free to discuss about the post content and you can send me feedbacks, if any, at:</em>  <a  href="mailto:shritam.bhowmick@gmail.com" style="text-decoration:none;"> <img style="border:none" alt="shritam_email" src="/images/email.png"></a>
           </span>
          <br/>
          <hr/>
          <a href="https://twitter.com/pwntoken" class="twitter-follow-button" data-show-count="false" data-size="large">Follow @pwntoken</a>
     </span>
</div>

我正在使用的原始源CSS _styles.scss，它是Octopress中用于处理所有CSS内容的预处理器：

// This File is imported last, and will override other styles in the cascade
// Add styles here to make changes without digging in too much
#content table:not(.highlight table) {
  border: 1px solid #e7e3e7;
  margin-bottom: 1.5em; // to match p style
  th, td {
    border: 1px dashed #e7e3e7;
    padding: 0 5px;
  }
  th {
    border-style: solid;
    font-weight: bold;
    background: url("/images/noise.png") repeat scroll left top #f7f3f7;
  }
  th[align="left"], td[align="left"] {
    text-align: left;
  }
  th[align="right"], td[align="right"] {
    text-align: right;
  }
  th[align="center"], td[align="center"] {
    text-align: center;
  }
}
body > footer {
    @include shadow-box(none,0 15px 15px #333,0.3);
  margin-bottom: 10px;
}
.about {
    font-style: italic;
    background-color: #FFF;
    padding: 10px;
    border: #e2edf2 2px dashed;
    background-color: #f4f8fa;
    overflow: hidden;
    clear: both;
    .about-image {
        width: 150px;
        float: left;
        display: inline-flexbox;
        margin-right: 20px;
        img {
            border-radius: 50%;
        }
    }
    .about-desc > hr {
        border: none;
        border-top: 1px solid #fff;
        padding-top: 10px;
        box-shadow: 0 -1px 0 #CBCED1;
    float: right;
    }
    #twitter-widget-1 {
        float: right
    }
    &.sidebar {
        border: none;
        background-color: transparent;
        box-shadow: none;
        text-align: center;
        .about-image,#twitter-widget-1 {
            float: none;
        }
        .about-desc {
            display: block;
            a {
                color: rgb(47, 99, 211);
            }
        }
        .about-image {
            img {
                border-radius: 50%;
                box-shadow: 0px 0px 0px 10px rgba(221, 214, 214, 0.2);
                border: 10px solid rgba(151, 151, 151, 0.2);
            }
        }
        @media only screen and (max-width: 768px) {
            display: none;
        }
    }
}
.blog-index + aside.sidebar {
    .about.sidebar {
        @media only screen and (max-width: 768px) {
            display: block;
        }
    }
}

li.related {
  padding-bottom: 10px;
  a {
    color: #F55A0A;
    font-size: 22px;
  }
  a:hover {
    border-bottom: 2px dashed #F9A67B;
  }
}

我不是CSS专家，我想知道如何解决这个问题？

Answer 1

在

MyVector<int> big_vector(std::numeric_limits<std::size_t>::max());
big_vector[-1] = 5; // big_vector[-1] is the last element in the array.

MyVector<int> big_vector2 = big_vector + 1;
std::cout << big_vector2[-2] << std::endl; // would print 5, since big_vector2 points at the second element in the array

删除内联样式<span class="about-desc"> <span style="float:right;">。

在Octopress上修复CSS。

1 个答案: