Форум Pawn-Wiki.Ru - Воплоти мечту в реальность!: Выравнивание текста - Форум Pawn-Wiki.Ru - Воплоти мечту в реальность!

Перейти к содержимому

Страница 1 из 1
  • Вы не можете создать новую тему
  • Вы не можете ответить в тему

[ HTML ]
Выравнивание текста
Оценка: -----

#1
Пользователь офлайн   Avenax 

  • Местный
  • Вставить ник
  • Раскрыть информацию
Помогите решить проблему не могу выровнять текст как на примере https://pp.userapi.c...jaMK1nd005Q.jpg
Вот сам код
<div class="top3 clearfix">
<div class="gtext"><b>Сейчас играет:</b>
<div id="track_name"></div>
<div class="live_wrapper">
<a href="#" id="myLink" onclick="playAudio();" class="live">PLAY ONLINE</a>
</div>
</div>
</div>
</div>
</div>


css

.gtext{ float: left; font-size: 15px; line-height: 20px; color:#a6bdc9; font-family: 'Oswald'; text-transform: uppercase;}




На данный момент у меня так https://prnt.sc/k0g38c
0

#2
Пользователь офлайн   Quentino 

  • Island
  • Вставить ник
  • Раскрыть информацию
Красные элементы сделай блочными, и затем родителю(зелёному) напиши: display: flex; justify-content: flex-end;

//А вообще то я не шарю будет ли это работать

Изображение

Сообщение отредактировал Quentino: 28 Июнь 2018 - 20:15

0

#3
Пользователь офлайн   PAWLO 

  • Местный
  • Вставить ник
  • Раскрыть информацию
Изображение



<div class = "player">
	<div class = "player_info">
		<div><b>Сейчас играет:</b></div>
		<div class = "player_sound">Linkin park</div>
	</div>
	<a href="#" onclick="playAudio();" class = "player_play">PLAY ONLINE</a>
</div>

<style type="text/css">
.player_info{ 
	float: left; 
	font-size: 15px; 
	line-height: 20px; 
	color:#a6bdc9; 
	font-family: 'Oswald'; 
	text-transform: uppercase;
}
.player
{
	display: flex;
	justify-content: space-between;
	width: 50%;
	background-color: #999;
	padding: 10px;
}
.player_play{
	background-color: #AFAFAF;
	padding: auto;
	padding: 10px;
	border-radius: 30px;
	color:black;
}
.player_play:hover{
	background-color: #222;
	color:white;
}
</style>




FLEXBOX - Урок

Сообщение отредактировал PAWLO: 06 Август 2019 - 11:25

0

Поделиться темой:


Страница 1 из 1
  • Вы не можете создать новую тему
  • Вы не можете ответить в тему

1 человек читают эту тему
0 пользователей, 1 гостей, 0 скрытых пользователей


Яндекс.Метрика