Ширина границы не работает

-2

Как изменить ширину нижней границы?Ширина границы не работает

Вот некоторые мой код:

h6 { 
    text-align: center; 
    border-bottom: 1px solid #D6D6D6; 
    border-bottom-width: 30%; 
    color: #858585; 
    font-size: 10px; 
    margin: 40px; 
    padding: 5px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-weight: bold; 
}

источник

2013-06-05 Sprunkas

Ширина границы не может быть в процентах. Процент того, что? Если вы хотите получить процент от самого элемента, вы должны использовать JavaScript. –

Я думаю, что причина, по которой вы голосуете за этот вопрос, состоит в том, что вы не объясняете, что именно вы пытаетесь достичь, что оставляло людей догадываться. Возможно, вы могли бы отредактировать его, чтобы сделать это понятным? – ChrisD

Определение ширины границы в % не является действительным, вы должны использовать px, em, rem, in, cm или что-то еще ...

источник

2013-06-05 13:35:01 Michal

Проблема в том, что приграничное дно меняет высоту, но не вес ... – Sprunkas

Что значит «вес»? – Michal

Pfu ... не вес, но длина – Sprunkas

Вы не можете укажите ширину в % - используйте px или относительную единицу, такую как em.

Используете ли вы

border-bottom: 5px solid #D6D6D6;

или

border-bottom-width: 3em;

не имеет значения, хотя. Обе работы.

источник

2013-06-05 13:35:02 Christoph

Вы не можете использовать процентные границы, но одна вещь, которую вы можете сделать, - создать фальшивую границу с помощью div. Так что ваш HTML может выглядеть следующим образом:

<div class="wrap"> 
    <h6>Title</h6> 
</div>

И ваш CSS:

h6 { 
    text-align: center; 
    background-color: white; 
    margin: 0; 
    padding: 5px; 
    color: #858585; 
    font-size: 10px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-weight: bold; 
} 
.wrap { 
    padding-bottom: 30%; 
    background-color: #D6D6D6; 
    margin: 40px; 
}

EDIT: вот jsfiddle играть с: http://jsfiddle.net/QR3pL/

EDIT 2: Вы на самом деле не объяснить, что вы пытаетесь достичь, но мне кажется, что вы, возможно, неправильно поняли свойство ширины границы. Его можно рассматривать как толщину границы. Если вы хотите установить горизонтальную длину (которая, по моему мнению, является основной предпосылкой), то это сложнее, но ее можно снова подделать.

Вот некоторые HTML:

<h6>A Title goes here</h6>

И вот CSS:

h6 { 
    position:relative; 
    text-align: center; 
    color: #858585; 
    font-size: 10px; 
    margin: 40px; 
    padding: 5px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-weight: bold; 
} 
h6:before { 
    content: ''; 
    position: absolute; 
    display: block; 
    border-bottom: 1px solid #D6D6D6; 
    width: 30%; 
    height: 100%; 
}

И jsfiddle: http://jsfiddle.net/EEfYQ/1/

источник

2013-06-05 13:45:28 ChrisD

использовать псевдоэлемент вместо неземной разметки. – Christoph

@ Кристоф Я обновил свой ответ. – ChrisD

Вы определить длину границы с h6 шириной - не с изолированное правило.

Попробуйте установить ширину для правила в h6 элемента:

h6 { 
    width: 30%; 
    border-bottom: 1px solid red; 
}

I have illustrated the situation here, on FiddleJS.

Но использовать осторожно, потому что все содержание h6 правило будет содержать 30% ширины.

источник

2013-06-05 13:49:22

Он не спрашивает о толщине границы, но о длине. Я показал ему, как работает - это отличается от того, что он думает. –

Возможно, вам стоит взглянуть на официальное определение «ширина границы» ... http://www.w3.org/TR/CSS2/box.html#border-width-properties –

Я знаю, что такое «ширина границы» " означает. Это именно то, о чем я говорю. 'border-width' не является для него решением. [Взгляните сюда] (http://jsfiddle.net/chiefGui/gGS9c/3/) –

Ширина границы не работает

ответ

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