How can I make the lines of words closer together, also my boarder does not go across all the way

Question

updated question from previous one

How can I make the lines of words closer together? also my boarder does not go across all the way Another update--> I figured out the line spacing issue just can't figure out the boarder //css

   .headerC {
   background: #89cff0;
   font: 36pt/40pt courier;color: white; 
   font-variant: small-caps; 
   border: thick dashed hotpink;

}

//html

<div class="headerC">
                <h1 align="center" >Contact</h1>
                <h4 align="center"> <a href="tel:203-831-9722" class="link">203-831-9722</a></h4>
                <h5 align="center" >234 East Ave 06855</h5>
                <h6 align="center" >Norwalk, CT</h6>

        </div>

You should know that using inline `style` attributes like this is strongly discouraged today: https://stackoverflow.com/questions/2612483/whats-so-bad-about-in-line-css — user229044, Jul 12 '18 at 17:31
@MelissaChillington I realize, I meant that to be helpful, sorry if it came across otherwise. We were all beginners once. — user229044, Jul 12 '18 at 17:47

Johannes · Answer 1 · 2018-07-12T17:29:45.573

1

erase the borderstyle from the h1 and h4elements and apply it to the container div

(plus you might want to use classes to be able to address HTML elements and put all CSS into an external stylesheet, which defines these classes)

edited Jul 12 '18 at 17:29

answered Jul 12 '18 at 17:23

Johannes

64,305
18
73
130

yea I have an external css but I did inline because I thought it would be easier – Melissa Chillington Jul 12 '18 at 17:31

score 1 · Accepted Answer · answered Jul 12 '18 at 17:37

The simplified version of code using external css and border on outer div:

HTML

 <div class="header">
     <h1 align="center" >Contact</h1>
     <h4 align="center"> <a href="tel:203-831-9722" class="link">203-831-9722</a></h4>
     <h4 align="center" >234 East Ave 06855</h4>
     <h4 align="center" >Norwalk, CT</h4>
 </div>

CSS

.header {
  background: #00080;
  font: 36pt/40pt courier; 
  font-variant: small-caps; 
  border: thick dashed hotpink;
}
.link {
  text-decoration:underline;
}

How can I make the lines of words closer together, also my boarder does not go across all the way

2 Answers2