2017-01-23 3 views
-1

enter image description hereУдаление пространства из строки

Я написал следующий HTML/CSS. Я не могу найти способ удалить пустое пространство вокруг «привет». Я также хотел бы сосредоточить их как на экране (оставив «привет» & «Мир» - выровненный влево). Однако белый интервал вокруг приветствия - вот что делает мою голову.

Любые подсказки были бы оценены.

<div class="row" style="border:solid 1px green;padding:0px;margin:0px;"> 
 
    <div class="col-lg-3 col-lg-offset-2 gauche" style="text-align:left;border:solid 1px red;width:120px;"> 
 
    <span style="font-size:14px;height:20px;border:solid 1px red;height:100px;">hello</span> 
 
    </div> 
 

 
    <div class="col-lg-5" style="vertical-align:middle;"> 
 
    <span style="font-size:14px;height:20px;border:solid 1px red;height:100px;">World</span> 
 
    </div> 
 
</div>

+0

вы можете создать [mcve], как с инфо при условии должно быть ничего вызывающего, что пространство. Какие рамки вы используете? – Pete

+0

Невозможно воспроизвести - http://codepen.io/Paulie-D/pen/jywNZy –

+0

почему вы указываете высоту дважды: 20px и 100px 'height: 20px; border: solid 1px red; height: 100px;' для обоих приветствий span и world span? Кроме того, когда я запускаю свой фрагмент кода, вокруг Hello нет пробела! Что такое ваш браузер? –

ответ

-1

Попробуйте это:

body { 
 
    text-align: center; 
 
} 
 
      
 
body * { 
 
    text-align: left; 
 
} 
 
      
 
.row { 
 
    margin: auto; 
 
    position: absolute; 
 
    top: 50%; 
 
    margin-top: -20px; 
 
} 
 
    
<!DOCTYPE html> 
 
<html lang="en"> 
 
<body> 
 
    <div class="row" style="border:solid 1px green;display: inline-block;"> 
 
     <div class="col-lg-3 col-lg-offset-2 gauche" style="text-align:left;border:solid 1px red;display:inline-block;"> 
 
      <span style="font-size:14px;height:20px;border:solid 1px red;height:100px;">hello</span> 
 
     </div> 
 
    
 
     <div class="col-lg-5" style="vertical-align:middle;"> 
 
      <span style="font-size:14px;height:20px;border:solid 1px red;height:100px;">World</span> 
 
     </div> 
 
    </div> 
 
</body> 
 
</html>

+0

Как это удалить белое пространство вокруг приветствия? – Pete

+0

Белым пространством, на которое вы ссылаетесь в коде, который я предоставил, фактически пустое пространство. Он может быть семантически удален, комментируя это, но вы не можете сделать два слова разного размера с обеих сторон и не сделать границу div, которая идет вокруг него, чтобы адаптировать форму, отличную от прямоугольной формы. – Lesotto

+0

P.S. вы даже попробовали весь код, который я вам дал, или просто скопировали HTML с встроенной частью? – Lesotto

Смежные вопросы