Позиционирование заголовков и img

Как позиционировать «средний дизайн» над логотипом и описанием под логотипом? все это должно быть в центре по вертикали и по горизонталиПозиционирование заголовков и img

Похоже, это сейчас

Heres код Теперь

.title { 
 
    text-align: center; 
 
    position: absolute; 
 
    color: white; 
 
    top: 50%; 
 
    left: 50%; 
 
    transform: translate(-50%, -50%); 
 
} 
 

 
#logo { 
 
    position: absolute; 
 
    top: 50%; 
 
    left: 50%; 
 
    transform: translate(-50%, -50%); 
 
    width: 350px; 
 
}

<div class="cover-wrapper"> 
 
      <div class="title"> 
 
      <h1 id="mean">Mean Design.</h1> 
 
      <img class="img-responsive" id="logo" src="MeanDesignLogo.png"> 
 
      <h6 id="des">ui/ux • web design • graphic design • illustration</h6> 
 
       </div> 
 
</div> <!-- cover wrapper -->

источник

2016-06-23 Chicky Egg

что ваша проблема? Я делаю это, просто измените цвет шрифта и посмотрим. https://jsfiddle.net/#&togetherjs=9fg9wF2xQi –

@Charles_R См. отредактированный вопрос, спасибо –

попробуйте это, поместите ** display: block; ** для каждого элемента –

Вы пытаетесь получить что-то вроде этого?

<!DOCTYPE html> 
<html> 
<head> 
<style> 
.title { 
    text-align: center; 
    position: absolute; 
    color: white; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    background-image:url(MeanDesignLogo.png); 
    background-repeat:no-repeat; 
    background-size:100% 100% 
} 

.title2 { 
    text-align: center; 
    position: absolute; 
    color: black; 
    top: 449px; 
    left: 592px; 
    transform: translate(-50%, -50%); 
} 

#logo { 
    position: absolute; 
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%); 
    width: 350px; 
} 
</style> 
</head> 
<body> 
<div class="cover-wrapper"> 
    <div class="title"> 
      <h1 id="mean">Mean Design.</h1> 
<h6 id="des"></h6> 
    </div> 
    <div class="title2"> 
    <h6 id="des">ui/ux • web design • graphic design • illustration</h6> 
    </div> 
</div> <!-- cover wrapper --> 
</body> 
</html>

источник

2016-06-23 06:49:42

Вы только должны удалить все CSS в #logo:

.title { 
 
    text-align: center; 
 
    position: absolute; 
 
    color: black; 
 
    top: 50%; 
 
    left: 50%; 
 
    transform: translate(-50%, -50%); 
 
}

<div class="cover-wrapper"> 
 
      <div class="title"> 
 
      <h1 id="mean">Mean Design.</h1> 
 
      <img class="img-responsive" id="logo" src="http://placehold.it/200x50?text=LOGO"> 
 
      <h6 id="des">ui/ux • web design • graphic design • illustration</h6> 
 
       </div> 
 
</div> <!-- cover wrapper -->

источник

2016-06-23 07:56:53 blonfu

Позиционирование заголовков и img

ответ

Смежные вопросы