I have written the following code:
<!DOCTYPE html>
<html>
<head>
<title>UMass Boston Computer Science Club About page</title>
<link href='https://fonts.googleapis.com/css?family=Chakra Petch' rel='stylesheet'>
<style>
.logo-umb {
height: 100px;
width: 100px;
float: left;
}
.link {
padding-left: 30px;
padding-right: 30px;
padding-top: 80px;
padding-bottom: 30px;
border: none;
}
.link-home,
.link-about,
.link-events,
.link-guests,
.link-contact {
font-family: 'Chakra Petch';
color: #005A8B;
}
.about-title {
font-family: 'Chakra Petch';
color: white;
}
.about-cs-club {
background-color: #005A8B;
float: right;
}
.university-hall {
float: left;
}
.about-p {
font-family: 'Chakra Petch';
color: white;
float: right;
}
.abouttext {
float: right;
}
th,
td {
padding-left: 15px;
padding-right: 15px;
padding-top: 10px;
padding-bottom: 10px;
}
.Address {
font-family: 'Chakra Petch';
color: #005A8B;
}
.links {
top: 100px;
}
</style>
</head>
<body>
<div class="Logo">
<img src="https://scontent-bos3-1.xx.fbcdn.net/v/t39.30808-6/275365687_1556735314708607_360968714522368993_n.jpg?stp=dst-jpg_s1080x2048&_nc_cat=108&ccb=1-5&_nc_sid=730e14&_nc_ohc=XIlEE10wTp8AX_QciOa&_nc_ht=scon...
class="logo-umb">
</div>
<div class="links">
<table>
<tr>
<td class="link"><a class="link-home">HOME</a></td>
<td class="link"><a class="link-about">ABOUT</a></td>
<td class="link"><a class="link-events">EVENTS</a></td>
<td class="link"><a class="link-guests">GUESTS</a></td>
<td class="link"><a class="link-contact">CONTACT US</a></td>
</tr>
</table>
</div>
<div class="about-cs-club">
<div class="university-hall">
<img src="https://hga.com/wp-content/uploads/2019/08/University-of-Massachusetts-Boston-%E2%80%93-University-Hall-interior-lobby-1.jpg" width="600" height="400">
</div>
<div class="abouttext">
<h1 class="about-title">What is the UMass Boston Computer Science club?</h1>
<p class="about-p">For motivated students who are interested in computer science and technology and attend UMass Boston, this student run computer science club is right for you. Taking place at the University Hall Room 4140 between 3:00-4:00 pm on Mondays, the computer
science club at UMass Boston is conveniently located in one of the newest and sexiest buildings at UMass Boston, and since anybody can attend the computer science club, when you attend the CS Club, you can learn everything, from web design to
app development to learning extra programming languages such as HTML, Java, JavaScript, Python, and Swift, and even, learning about operating systems and the history of computers as well. So everybody, come and join this CS Club. We plan events,
run competitions and competition training, share knowledge, and run excursions.</p>
</div>
</div>
<p class="Address">
University of Massachusetts Boston
<br> 100 Morrissey Blvd.
<br> Boston, MA 02125-3393
<br> 617.287.5000
</p>
</body>
</html>However, I am facing an issue where the text appears on the right while the image is displayed on the left side. I require assistance to modify it so that the image aligns to the left and the paragraph content is shown on the right. Is there a method to merge these two elements successfully, ensuring the paragraph content displays on the right-hand side of the webpage next to the image? Despite attempting various solutions, I have been unsuccessful in achieving the desired layout.