Как указать длину label внутри input checkbox?

Question

[Undefined User]

<div class="app__design"><input type="checkbox" class="checkbox"><label for="app__design" class="button"><svg version="1.1" class="check" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 150 111" style="enable-background:new 0 0 150 111;" xml:space="preserve">
                  <g transform="translate(0.000000,111.000000) scale(0.100000,-0.100000)">
                    <path d="M950,705L555,310L360,505C253,612,160,700,155,700c-6,0-44-34-85-75l-75-75l278-278L550-5l475,475c261,261,475,480,475,485c0,13-132,145-145,145C1349,1100,1167,922,950,705z"></path>
                  </g>
                  </svg><span class="btn__text">App Design</span></label></div>

Пробовал указывать длину всякими способами, но ничего не работает, только через паддинг. Как можно указать длину для кнопки в таком случае?

Comments

[Steppp]

Что???
У вас внутри input ничего нет! И ничего не может быть, кроме введенных данных!
Длину label??? "lenght" - нет такого в css!
Попробуйте ширину сделать) width: 50%;
И где тут кнопка? span? - span это не кнопка! Кнопка button!
и button нельзя вкладывать в label !!!

[Undefined User]

Steppp, здесь не будет никаких введенных данных, это чекбокс как бы 0_о. Про length и width прям очень полезно, спасибо, от души просто. Я привык называть width длиной, сам не знаю почему, но это не повод корчить из себя самого умного, я и сам на достаточном уровне владею английским. Никаких вложений button здесь я не вижу, вы перепутали тег с классом. Зачем учить кого-то, если человек всего-лишь попросил помочь с указанием размеров, особенно если вы не можете отличить тег от класса и поле ввода от чекбокса?

Answer 1

[Юрий]

Без CSS конечно можно только гадать, потому что все телепаты в отпуске, но скорее всего у вашего лейбла не сброшен display. Который по умолчанию inline и, соответственно, указание ширины игнорирует. Сделайте display: block или display: flex.

И кстати ваш for="app__design" в лейбле тоже работать не будет, потому что на инпуте нет соответствующего id.

Comments

[Undefined User]

Да, именно это и было причиной, забыл написать ответ.

[Undefined User]

Undefined User, не знаю, как я упустил это, но в этом и состояла проблема