[Homework] CSS-Presentation - Problem {1} - The Jaunty Text Field - Софтуерен университет

[Homework] CSS-Presentation - Problem {1} - The Jaunty Text Field

Въпросите са два.

1. Как да направя четирите цвята на дъга-рамката да се разпределям равномерно в 10-пикселовия border. С долунаписания код всичко става в червено, а от другите цветове има само по 1px. Същото се е получила и в задачата от лекцията -> CSS-Presentation-Demos > 4. Borders-Other-Styles.html.

border: 10px solid;
border-radius: 100px;
-moz-border-top-colors: blue green yellow red;
-moz-border-right-colors: blue green yellow red;
-moz-border-bottom-colors: blue green yellow red;
-moz-border-left-colors: blue green yellow red;

2. На двата оранжени бутона, които не са бутони, всичко им го нагласих, освен това да се подравняват хоризонтално един до друг, а не както са в момента - вертикално подравнени Как да стане? Ето как им отредих по два класа, но и това не помогна:

<div class="not-a-button first-button">We are not buttons :)</div>
<div class="not-a-button second-button">We are not buttons :)</div>

Здравей :) Относно въпрос 2 - аз мисля, че има по-интелигентен начин за получаване на цветната рамка. Използвах <article> и псевдо елемент article:before, така реално се получиха 2 елемента. На всеки от тях сложих border i box-shadow, т.е.. получиха се 4 пръстена, всеки в различен цвят. Виж кодът ми тук: https://softuni.bg/forum/11558/cveten-border. Относно въпрос 2: В условието е посочено, че оранжевите "не бутони" всъщност са текстови полета (<input type="text"). Не са преподадени още. Те са инлайн елементи и сами се подреждат хоризонтално един стед друг, ако не им укажеш друго в CSS. Използвайки тях, няма да ти е нужно да усложняваш нещата с позициониране и т.н. Успех! :)