Вертикальный центр выравнивания в начальной загрузке 4 [дубликат]CSS

Разбираемся в CSS
Ответить
Anonymous
 Вертикальный центр выравнивания в начальной загрузке 4 [дубликат]

Сообщение Anonymous »

Я пытаюсь сосредоточить свой контейнер в середине страницы, используя начальную загрузку 4. Я до сих пор неудачно. class = "Snippet-Code-JS Lang-JS PrettyPrint-Override">

Код: Выделить всё

var currentAuthor = "";
var currentQuote  = "";
function randomQuote() {
$.ajax({
url: "https://api.forismatic.com/api/1.0/?",
dataType: "jsonp",
data: "method=getQuote&format=jsonp&lang=en&jsonp=?",
success: function( response ) {
$("#quote-content").html('[i] ' + response.quoteText + ' [/i]');
$("#quote-author").html('
' + response.quoteAuthor + '
');

currentAuthor = response.quoteAuthor;
currentQuote  = response.quoteText
}
});
}

function openURL(url){
window.open(url,'Share', 'width=550, height=400, toolbar=0, scrollbars=1 ,location=0 ,statusbar=0,menubar=0, resizable=0');
}

function tweetQuote(){
openURL('https://twitter.com/intent/tweet?hashtags=quotes,freecodecamp&related=freecodecamp&text=' + encodeURIComponent('"' + currentQuote + '" - ' + currentAuthor));
}

$(document).ready(function () {
randomQuote();

$("#get-another-quote-button").click(function(){
randomQuote();
});

$('#tweet').on('click', function() {
tweetQuote();
});
});< /code>
html, body {
background-image: url("https://www.mylinea.com/wp-content/uploads/beautiful-trees-stock-photo-055.jpg");
background-color: #17234E;
margin-bottom: 0;
min-height: 30%;
background-repeat: no-repeat;
background-position: center;
-webkit-background-size: cover;
background-size: cover;
}

.btn-new-quote {
color: #0C0C0D;
background-color: transparent;
border-color: #414147;
}

.btn-new-quote:hover {
color: #0C0C0D;
background-color: #9A989E;
border-color: #0C0C0D;
}

#tweet {
color: RGB(100, 100, 100);
}

#tweet:hover {
color: RGB(50, 50, 50);
}

.jumbotron {
position: relative;
top: 50%;
transform: translateY(-50%);
opacity: .85;
border-color:  RGB(50, 50, 50);
padding-bottom: 8px;
}< /code>






[i][/i][i][/i]




[url=#]
[i][/i]
[/url]

Don't Quote Me on This...








Подробнее здесь: https://stackoverflow.com/questions/422 ... ootstrap-4
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»