function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Shruthi MN 88Shruthi MN 88 

HTML and CSS page

HI Everyone,

Can you help me design this page?
<html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
      <meta http-equiv="Content-Style-Type" content="text/css" />
      <meta name="generator" content="Aspose.Words for .NET 23.8.0" />
      <title></title>
      <style type="text/css">body { font-family:'Times New Roman'; font-size:12pt;
  
    
 }p { margin:0pt }
ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

li {
  display: inline;
}

 
</style>
   </head>
   <body>
      <div  >

         <p style="margin-top:11.25pt; margin-left:133.05pt; text-align:justify; line-height:34.15pt"><span style="font-family:Calibri; font-size:28pt">The</span><span style="font-family:Calibri; font-size:28pt; letter-spacing:6.45pt"> </span><span style="font-family:Calibri; font-size:28pt">Dental</span><span style="font-family:Calibri; font-size:28pt; letter-spacing:5.1pt"> </span><span style="font-family:Calibri; font-size:28pt">Hygiene</span><span style="font-family:Calibri; font-size:28pt; letter-spacing:7.55pt"> </span><span style="font-family:Calibri; font-size:28pt">Association</span></p>
<img src="img_girl.jpg" alt="Girl in a jacket" width="100" height="40" >

         <p style="margin-top:6.5pt; margin-right:479.05pt; text-indent:0.65pt; line-height:8pt"><span style="font-family:Calibri; font-size:8pt" >The Dental Hygiene</span></p>
<img src="image/your-image.png" width="300"  style="float: right" />
     <p style="margin-top:7.1pt; margin-left:32.1pt; text-align:justify; line-height:15.85pt"><span style="font-family:Calibri; font-size:13pt">Home</span><span style="font-family:Calibri; font-size:13pt; letter-spacing:52.4pt"> </span><span style="font-family:Calibri; font-size:13pt">Adults</span><span style="font-family:Calibri; font-size:13pt; letter-spacing:59.8pt"> </span><span style="font-family:Calibri; font-size:13pt">Kids</span><span style="font-family:Calibri; font-size:13pt; letter-spacing:61.25pt"> </span><span style="font-family:Calibri; font-size:13pt">News</span><span style="font-family:Calibri; font-size:13pt; letter-spacing:60.9pt"> </span><span style="font-family:Calibri; font-size:13pt">FAQ</span><span style="font-family:Calibri; font-size:13pt; letter-spacing:50.85pt"> </span><span style="font-family:Calibri; font-size:13pt">Glossary</span></p>

         <p style="margin-top:15.55pt; margin-left:259.55pt; text-align:justify; line-height:26.85pt"><span style="font-family:Calibri; font-size:22pt">Kids</span></p>

         <p style="margin-top:23.4pt; margin-right:219.3pt; margin-left:13.1pt; text-indent:0.65pt; line-height:12.45pt"><span style="font-family:Calibri; font-size:9pt">Bringing</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.9pt"> </span><span style="font-family:Calibri; font-size:9pt">up</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.95pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">child</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.55pt"> </span><span style="font-family:Calibri; font-size:9pt">with</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.05pt"> </span><span style="font-family:Calibri; font-size:9pt">proper</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.5pt"> </span><span style="font-family:Calibri; font-size:9pt">attention</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.5pt"> </span><span style="font-family:Calibri; font-size:9pt">to</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.35pt"> </span><span style="font-family:Calibri; font-size:9pt">their</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">oral</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.05pt"> </span><span style="font-family:Calibri; font-size:9pt">health</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">is</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.9pt"> </span><span style="font-family:Calibri; font-size:9pt">a lifelong</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.25pt"> </span><span style="font-family:Calibri; font-size:9pt">investment</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.55pt"> </span><span style="font-family:Calibri; font-size:9pt">in</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1pt"> </span><span style="font-family:Calibri; font-size:9pt">their</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.85pt"> </span><span style="font-family:Calibri; font-size:9pt">health,</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.2pt"> </span><span style="font-family:Calibri; font-size:9pt">which</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.75pt"> </span><span style="font-family:Calibri; font-size:9pt">will</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.05pt"> </span><span style="font-family:Calibri; font-size:9pt">benefit</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.85pt"> </span><span style="font-family:Calibri; font-size:9pt">them</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">greatly for</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.4pt"> </span><span style="font-family:Calibri; font-size:9pt">the</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">rest</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.8pt"> </span><span style="font-family:Calibri; font-size:9pt">of</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">their</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">lives.</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.1pt"> </span><span style="font-family:Calibri; font-size:9pt">Early</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">childhood</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">cavities</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.05pt"> </span><span style="font-family:Calibri; font-size:9pt">is</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.55pt"> </span><span style="font-family:Calibri; font-size:9pt">a</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.85pt"> </span><span style="font-family:Calibri; font-size:9pt">disease</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3pt"> </span><span style="font-family:Calibri; font-size:9pt">that can</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.5pt"> </span><span style="font-family:Calibri; font-size:9pt">ruin</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.3pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">child’s</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.35pt"> </span><span style="font-family:Calibri; font-size:9pt">teeth,</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.2pt"> </span><span style="font-family:Calibri; font-size:9pt">even</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.85pt"> </span><span style="font-family:Calibri; font-size:9pt">into</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.75pt"> </span><span style="font-family:Calibri; font-size:9pt">adulthood,</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.8pt"> </span><span style="font-family:Calibri; font-size:9pt">but</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.9pt"> </span><span style="font-family:Calibri; font-size:9pt">it</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.4pt"> </span><span style="font-family:Calibri; font-size:9pt">is</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.9pt"> </span><span style="font-family:Calibri; font-size:9pt">easily preventable.</span></p>
   

   <p  style="margin-top:2.6pt; margin-right:226.55pt; margin-left:13.1pt; line-height:12.45pt"><span style="font-family:Calibri; font-size:9pt">There</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.95pt"> </span><span style="font-family:Calibri; font-size:9pt">are</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.75pt"> </span><span style="font-family:Calibri; font-size:9pt">a</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.85pt"> </span><span style="font-family:Calibri; font-size:9pt">wide</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.25pt"> </span><span style="font-family:Calibri; font-size:9pt">variety</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.3pt"> </span><span style="font-family:Calibri; font-size:9pt">of</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.6pt"> </span><span style="font-family:Calibri; font-size:9pt">steps</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.95pt"> </span><span style="font-family:Calibri; font-size:9pt">you</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.1pt"> </span><span style="font-family:Calibri; font-size:9pt">can</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.5pt"> </span><span style="font-family:Calibri; font-size:9pt">take</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.4pt"> </span><span style="font-family:Calibri; font-size:9pt">to</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.35pt"> </span><span style="font-family:Calibri; font-size:9pt">teach</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.55pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">child good</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.8pt"> </span><span style="font-family:Calibri; font-size:9pt">dental</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">habits,</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.5pt"> </span><span style="font-family:Calibri; font-size:9pt">and</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.25pt"> </span><span style="font-family:Calibri; font-size:9pt">one</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.7pt"> </span><span style="font-family:Calibri; font-size:9pt">of</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.6pt"> </span><span style="font-family:Calibri; font-size:9pt">the</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">best</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.9pt"> </span><span style="font-family:Calibri; font-size:9pt">is</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.55pt"> </span><span style="font-family:Calibri; font-size:9pt">leading</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.8pt"> </span><span style="font-family:Calibri; font-size:9pt">by</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.95pt"> </span><span style="font-family:Calibri; font-size:9pt">example. Make</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.3pt"> </span><span style="font-family:Calibri; font-size:9pt">sure</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.4pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">child</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.2pt"> </span><span style="font-family:Calibri; font-size:9pt">knows</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.95pt"> </span><span style="font-family:Calibri; font-size:9pt">how</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.05pt"> </span><span style="font-family:Calibri; font-size:9pt">much</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.75pt"> </span><span style="font-family:Calibri; font-size:9pt">importance</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.25pt"> </span><span style="font-family:Calibri; font-size:9pt">you</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.1pt"> </span><span style="font-family:Calibri; font-size:9pt">place</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.85pt"> </span><span style="font-family:Calibri; font-size:9pt">on dental</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.8pt"> </span><span style="font-family:Calibri; font-size:9pt">health</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">so</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.5pt"> </span><span style="font-family:Calibri; font-size:9pt">they</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.65pt"> </span><span style="font-family:Calibri; font-size:9pt">know</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.55pt"> </span><span style="font-family:Calibri; font-size:9pt">that</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.55pt"> </span><span style="font-family:Calibri; font-size:9pt">it</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.05pt"> </span><span style="font-family:Calibri; font-size:9pt">is</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.9pt"> </span><span style="font-family:Calibri; font-size:9pt">something</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:4.5pt"> </span><span style="font-family:Calibri; font-size:9pt">to</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.35pt"> </span><span style="font-family:Calibri; font-size:9pt">be</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.55pt"> </span><span style="font-family:Calibri; font-size:9pt">valued. Brushing</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.95pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"> </span><span style="font-family:Calibri; font-size:9pt">teeth</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.15pt"> </span><span style="font-family:Calibri; font-size:9pt">along</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">with</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.4pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.9pt"> </span><span style="font-family:Calibri; font-size:9pt">child</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.55pt"> </span><span style="font-family:Calibri; font-size:9pt">and</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.25pt"> </span><span style="font-family:Calibri; font-size:9pt">letting</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.85pt"> </span><span style="font-family:Calibri; font-size:9pt">them</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> </span><span style="font-family:Calibri; font-size:9pt">follow your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.9pt"> </span><span style="font-family:Calibri; font-size:9pt">lead</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.4pt"> </span><span style="font-family:Calibri; font-size:9pt">can</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.5pt"> </span><span style="font-family:Calibri; font-size:9pt">be</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.55pt"> </span><span style="font-family:Calibri; font-size:9pt">really</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.75pt"> </span><span style="font-family:Calibri; font-size:9pt">helpful</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.25pt"> </span><span style="font-family:Calibri; font-size:9pt">in</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1pt"> </span><span style="font-family:Calibri; font-size:9pt">setting</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.7pt"> </span><span style="font-family:Calibri; font-size:9pt">up</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:0.95pt"> </span><span style="font-family:Calibri; font-size:9pt">the</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.15pt"> <</span><span style="font-family:Calibri; font-size:9pt">habit</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.05pt"> /span><span style="font-family:Calibri; font-size:9pt">of</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1.6pt"> </span><span style="font-family:Calibri; font-size:9pt">teeth brushing</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3.45pt"> </span><span style="font-family:Calibri; font-size:9pt">in</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:1pt"> </span><span style="font-family:Calibri; font-size:9pt">your</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:2.25pt"></span><span style="font-family:Calibri; font-size:9pt">child’s</span><span style="font-family:Calibri; font-size:9pt; letter-spacing:3pt">  </span></p>
   
      </div>
   </body>
</html>
User-added image
AshwiniAshwini (Salesforce Developers) 
Hi Shruthi,
Are you trying to embed this html code in vfpage/lwc?
Shruthi MN 88Shruthi MN 88
No its just a html page
AshwiniAshwini (Salesforce Developers) 
Below is the sample code which you can refer and make further adjustments based on your requirements and  design preferences:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<meta name="generator" content="Aspose.Words for .NET 23.8.0" />
<title>Dental Hygiene Association</title>
<style type="text/css">
  body {
    font-family: 'Times New Roman';
    font-size: 12pt;
  }
  p {
    margin: 0;
  }
  ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
  li {
    display: inline;
  }
  .header {
    text-align: center;
  }
  .navbar {
    text-align: center;
    margin-top: 10px;
  }
  .image {
    float: right;
    margin: 10px;
  }
  .section-title {
    text-align: center;
    margin-top: 20px;
    font-size: 22pt;
  }
  .content {
    margin: 10px;
    text-align: justify;
    line-height: 1.5;
  }
</style>
</head>
<body>
<div class="header">
  <h1 class="header">The Dental Hygiene Association</h1>
  <img src="img_girl.jpg" alt="Logo" width="100" height="40">
</div>
<div class="navbar">
  <ul>
    <li>Home</li>
    <li>Adults</li>
    <li>Kids</li>
    <li>News</li>
    <li>FAQ</li>
    <li>Glossary</li>
  </ul>
</div>
<div class="section-title">Kids</div>
<div class="content">
  <img src="image/your-image.png" alt="Image" class="image" width="300">
  <p>Bringing up your child with proper attention to their oral health is a lifelong investment in their health, which will benefit them greatly for the rest of their lives. Early childhood cavities is a disease that can ruin your child’s teeth, even into adulthood, but it is easily preventable.</p>
  <p>There are a wide variety of steps you can take to teach your child good dental habits, and one of the best is leading by example. Make sure your child knows how much importance you place on dental health so they know that it is something to be valued.</p>
  <p>Brushing your teeth along with your child and letting them follow your lead can be really helpful in setting up the habit of teeth brushing in your child’s routine.</p>
</div>
</body>
</html>

You can refer below links to build websites using html and css:
https://www.w3schools.com/howto/howto_website_create_free.asp
https://www.geeksforgeeks.org/design-a-web-page-using-html-and-css/

If this information helps, please mark the answer as best. Thank you
Shruthi MN 88Shruthi MN 88
its not as per the page