Я хотел бы показать круги для разных уровней. Например, если уровень является опытным, он покажет 1 круг. Я могу показать круги в соответствии с их уровнями, но круг отображается вертикально. Я хочу, чтобы он показывал это горизонтально.
for($a = 0; $a < $count; $a++)
{
$b = $languagelevel[$a][0];
echo $b;
if($languagelevel[$a][1] == "Proficient")
{
for($i = 0; $i < 1; $i++)
{
echo "<div class='language'></div>";
}
}
else if($languagelevel[$a][1] == "Good")
{
for($i = 0; $i < 2; $i++)
{
echo "<div class='language'></div>";
}
}
else if($languagelevel[$a][1] == "Very Good")
{
for($i = 0; $i < 3; $i++)
{
echo "<div class='language'></div>";
}
}
else
{
for($i = 0; $i < 4; $i++)
{
echo "<div class='language'></div>";
}
}
echo "<br>";
Это мой код CSS для круга. Это покажет круги по вертикали, но я хочу это по горизонтали.
.language
{
border-radius: 50%;width: 20px;
height: 20px;
padding: 8px;
background: #fff;
border: 2px solid #666;
color: #666;font: 20px Arial, sans-serif;
}
Вы пытались использовать float: left;
на ваше .language
учебный класс?
И с margin-left
Вы можете поместить некоторое пространство между кругами.
Других решений пока нет …