Есть блок div с внутренним элементом h1 и не получается данный элемент распологать например наверху/снизу/слева/ или на одном уровне с соседними блоками, элемент как будто лежит внизу и никаким position или align не могу его расположить как угодно мне :/
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.3/Chart.js"></script>
<title>Document</title>
</head>
<body>
<div style="display: inline-block;">
<canvas id="layanan" width="340px" height="340px"></canvas>
</div>
<div style="display: inline-block;">
<h1> второй элемент </h1>
<!-- как выравнивать данный элемент по вертикали/гор-ли -->
</div>
<div style="display: inline-block;">
<canvas id="layanan_subbagian" width="440px" height="340px"></canvas>
</div>
</body>
<script>
$(function() {
let ctx = document.getElementById("layanan").getContext('2d');
let data = {
datasets: [{
data: {
{
data | safe
}
},
backgroundColor: ['#696969', '#808080', '#A9A9A9', '#C0C0C0', '#D3D3D3', 'lightgreen', 'lightblue', 'red'],
}],
labels: {
{
labels | safe
}
}
};
let myDoughnutChart = new Chart(ctx, {
type: 'pie',
data: data,
options: {
responsive: false,
maintainAspectRatio: false,
legend: {
position: 'bottom',
labels: {
boxWidth: 12
}
}
}
});
let ctx_2 = document.getElementById("layanan_subbagian").getContext('2d');
let data_2 = {
datasets: [{
data: {
{
data | safe
}
},
backgroundColor: ['#696969', '#808080', '#A9A9A9', '#C0C0C0', '#D3D3D3', 'lightgreen', 'lightblue', 'red'],
}],
labels: {
{
labels | safe
}
}
};
let myDoughnutChart_2 = new Chart(ctx_2, {
type: 'bar',
data: data_2,
options: {
responsive: false,
maintainAspectRatio: false,
legend: {
position: 'bottom',
labels: {
boxWidth: 12
}
}
}
});
});
</script>
</html>
data, labels, safe
определять пробовали?Uncaught SyntaxError: Unexpected token '{'