I'm trying to format text in html, but there's random spacing that wont go away. I tried fixing padding and margins, but that didn't do anything to help.
I'm new to web dev so I'd appreciate some help and guidance!
Here's my code:
<center> <h2> Hello! </h3> </center>
<h4 style="left: 10px; padding-left: 10px; margin: 0px"> Some thing goes here </h5>
<h6 style = "right: 90px; padding-left: 10px; padding-bottom: 0px; margin: 0px"> test </h6>
<h6 style = "padding-left: 20px; padding-top: 0px; padding-right: 20px; font-style: regular;"> description </h6>
I highly recommend using Chrome's inspect feature (called DevTools) which opens a new window that provides client side coding that makes developing much easier!
As a brief summary, with DevTools, you can:
Elements
tab). This is client side only (HTML, CSS, JS, etc). CSS is on the right side by default. You can modify code such as CSS to meet your needs which you can then save to your development files.console.log()
or checking things like JSON output which will be broken down in an understandable, collapsible view (Console
tab).{}
in the bottom left which will pretty-print
it and make it more legible.This will align the columnar text. The only change was padding-left: 20px;
to padding-left: 10px;
.
<center> <h2> Hello! </h3> </center>
<h4 style="left: 10px; padding-left: 10px; margin: 0px"> Some thing goes here </h5>
<h6 style = "right: 90px; padding-left: 10px; padding-bottom: 0px; margin: 0px"> test </h6>
<h6 style = "padding-left: 10px; padding-top: 0px; padding-right: 20px; font-style: regular;"> description </h6>
Alternatively, if you are trying to get rid of the space before / after the description
, you need to add margin: 0px;
like so:
<center> <h2> Hello! </h3> </center>
<h4 style="left: 10px; padding-left: 10px; margin: 0px"> Some thing goes here </h5>
<h6 style = "right: 90px; padding-left: 10px; padding-bottom: 0px; margin: 0px"> test </h6>
<h6 style = "margin: 0px; padding-left: 10px; padding-top: 0px; padding-right: 20px; font-style: regular;"> description </h6>