Skip to content

Instantly share code, notes, and snippets.

@king101-bit
Created October 10, 2020 17:18
Show Gist options
  • Select an option

  • Save king101-bit/6ddaa45cbacd1f06f7a95ca962f3ab34 to your computer and use it in GitHub Desktop.

Select an option

Save king101-bit/6ddaa45cbacd1f06f7a95ca962f3ab34 to your computer and use it in GitHub Desktop.
i need help to make a text that's out of a box in my code to me in the box
<html lang="en">
<head>
<link rel="stylesheet" href="completed.css"
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="box">
<div style="display:inline-block;">
<h1>Hello,John doe!</h1>
</div>
<div class="pfp" style="display:inline-block;vertical-align:top;">
<img src="download (3).jpg" class="pfp" class="center">
</div>
<a href="theblog.html"><button class="button">Click here to begin!</button></a>
</div>
<label id="lblGreetings"></label>
</body>
<script>
var myDate = new Date();
var hrs = myDate.getHours();
var greet;
if (hrs < 12)
greet = 'Good Morning';
else if (hrs >= 12 && hrs <= 17)
greet = 'Good Afternoon';
else if (hrs >= 17 && hrs <= 24)
greet = 'Good Evening';
document.getElementById('lblGreetings').innerHTML =
'<b>' + greet + '</b> and welcome to The emeraldfield blog!.com!';
</script>
</html>
body{
margin:0;
padding:0;
background:url(Hi.jpg) no-repeat;
background-size:cover;
}
.box{
width: 450px;
background: rgba(0, 0, 0, 0.4);
padding: 40px;
text-align: center;
margin: auto;
margin-top: 5%;
color: white;
font-family: 'Century Gothic',sans-serif;
}
.pfp{
border-radius: 50%;
width: 200px;
height: 200px;
}
.center {
display: block;
margin-left: auto;
margin-right: auto;
width: 50%;
}
h1{
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-style: oblique;
font-weight: bold;
text-align:justify;
}
.button{
text-align:left ;
color: blue;
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
#lblGreetings{
text-align: center;
}
@king101-bit
Copy link
Author

please get back to me i need it!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment