html - 将三个 div 类放入同一行

Question

我想知道如果可能的话，如何在不更改 HTML 的情况下将包含“Quality Analyst”、“Celestica Sdn Bhd”和“MYR 2xxx”的内容放在同一行

html:

<div class="colMiddle resume-detail-item-middle">
    <div class="pageRow resume-detail-position long-text-word">Quality Analyst</div>
    <div class="pageRow resume-company-location long-text-word">Celestica (AMS) Sdn. Bhd.</div>
    <div class="pageRow resume-detail-item-inner resume-margin">
        <div class="resume-detail-item-inner-left resume-summary-heading resume-label">Monthly Salary</div>
        <div class="resume-detail-item-inner-middle resume-summary-heading">MYR&nbsp;2,515</div>

... missing html

以更清晰的方式:

<div class="outter-containement">
    <div class="inner-content-1">inner-content-1</div>
    <div class="inner-content-2">inner-content-2</div>
    <div class="inner-content-3">
        <div class="sub-inner-content-3-1">sub-inner-content-3-1</div>
        <div class="sub-inner-content-3-2">sub-inner-content-3-2</div>
    </div>
</div>

我如何在一行 inner-content-1、inner-content-2 和 sub-inner-content-3-2 上对齐

http://jsfiddle.net/K58S2/14/

Answer 1

我建议像这样更改 HTML:http://jsfiddle.net/K58S2/11/

但是您说的是不更改 HTML，所以这是一个 CSS 答案:http://jsfiddle.net/K58S2/7/

.resume-detail-position, .resume-company-location{
   float:left; 
   width:auto;
   clear:none;
   margin-right:7px;
}
.resume-company-location{
   margin-top:1px;   
}