-2

I have a box in HTML and I want to add more text to it on a new line using CSS.

I tried creating another HTML tag but that just gets messy and not part of the box. Also tried content: "ex"; but that did nothing.

.Device1 {
  position: relative;
  left: 8%;
  top: 20px;
  text-align: center;
}
<div class="Device1" style="width: 400px; height: 100px;border: 1px solid #000000;">Device 1</div>

I want a box that says device 1 on top and under it I would like to add other texts.

Heretic Monkey
  • 11,687
  • 7
  • 53
  • 122
Mohammad
  • 95
  • 2
  • 9
  • 1
    HTML is for content and structure, CSS is for presentation. If you want more real text on the page, semantically speaking, it should be in HTML. If you want two lines inside the box, consider making two `
    `s inside the current one rather than a second one outside.
     – skyline3000 Jul 17 '19 at 20:33

2 Answers2

1

Since div is a container just put more tags inside!

so you can have the css look like this

.Device1 {
  position: relative;
  left: 8%;
  top: 20px;
  text-align:center;
  width: 400px;
  height: 100px;
  border: 1px solid #000000;
}

and have the html look something like this

<div class="Device1">
  Device 1
  <h1>Other Text</h1><br>
  <p> more text</p>

</div>
Frank
  • 11
  • 5
0

You can try this posation property . 

.Device1 {
  position: relative;
  left: 8%;
  top: 20px;
  text-align: center;
}
<div class="Device1" style="width: 400px; height: 100px;border: 1px solid #000000;">Device 1</div>
<span style=" position: relative; top: -64px; left: 124px; ">new line </span>
himanshu
  • 56
  • 5