Я не могу добавить отступы к кнопке, браузер говорит "значение свойства invaild" - PullRequest
0 голосов
/ 02 марта 2020

/*****************************/
/* overall setup*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    background-color: #fff;
    color: #454545;
    font-family: 'Rubic';
    font-weight: 300;
    font-size: 20px;
    text-rendering: optimizeLegibility;
}
/******************************/

.row {
    max-width: 1140px;
    margin: 0;
}

header {
    background-image: linear-gradient(rgba(0, 0, 0, 0.7),rgba(0, 0, 0, 0.7)) ,url(images/business-1845350.jpg);
    background-size: cover;
    background-position: center;
    height: 100vh;
}
.hero-text-box {
    position: absolute;
    width: 1140px;
    top: 50%;
    right: 50%;
    transform: translate(65%, -50%);
}
h1 {
    margin: 0;
    color: #fff;
    font-size: 240%;
    font-weight: 300;
    letter-spacing: 1px;
    word-spacing: 4px;
}
.btn-full {
    display: inline-block;
    padding: 10px,30px;
    font-weight: 300;
}
<!DOCTYPE html>
<html dir="rtl" lang="he-IL">

    <head>
        <link rel="stylesheet" type="text/css" href="vendors/css/normalize.css">
        <link rel="stylesheet" type="text/css" href="vendors/css/grid.css">
        <link rel="stylesheet" type="text/css" href="resources//css/style.css">
        <link href="https://fonts.googleapis.com/css?family=Rubik:300,300i,400&display=swap&subset=hebrew" rel="stylesheet">
        <title>לימור מלול - יבוא בידיים טובות</title>
    
    </head>


    <body>
        <header>
            <div class="hero-text-box">
                <h1> יבוא מוצלח מתחיל כאן.<br> המרכז ליבואנים מתחילים. </h1>
                <a class="btn-full" href="#"> אני רוצה להתחיל לייבא </a>
                <a class="btn btn-outline" href="#"> אני רוצה לקרוא עוד </a>
            </div>
        </header>
    
    </body
</html>

Я не могу добавить заполнение в класс btn-full. Кроме того, я не уверен, что текстовое поле героя центрировано, потому что в ходе обучения я учусь у него, а у меня - ртл. инструктор использовал код

.hero-text-box {
position: absolute;
width: 1140px;
top: 50%;
right: 50%;
transform: translate(-50%, -50%);

} Не могли бы вы также сказать мне, если мой код в части .hero-text-box в порядке и соответствует коду инструктора?

thx для помощники

1 Ответ

2 голосов
/ 02 марта 2020

напишите так

.btn-full {
    display: inline-block;
    padding: 10px 30px; /*remove ',' */
    font-weight: 300;
}
...