I want to create a small square colour filled box in HTML CSS And most important - I want to write one line after the box

0 votes

I have created a colored square box using code

.box {
  height: 20px;
  width: 20px;
  margin-bottom: 15px;
  border: 1px solid black;
}

.red {
  background-color: red;
}

.green {
  background-color: green;
}

.blue {
  background-color: blue;
}
<div class='box red'></div>= Super Fast Trains<br>
<div class='box green'></div>= Mail/Express Trains<br>
<div class='box blue'></div>= Local/ Passenger Trains

So, if you could perhaps assist me with the proper update of my code to receive text following boxes and in the same margin, that would be great.

Jun 20, 2022 in CSS by Edureka
• 13,620 points
5,735 views

1 answer to this question.

0 votes

Try using the square html entity:

<div style="color:blue">&#9632;</div>
answered Jun 28, 2022 by Edureka
• 12,690 points

Related Questions In CSS

0 votes
0 answers

How can I create a round arrow with only HTML and CSS?

Using CSS and HTML, I'm attempting to ...READ MORE

Jul 8, 2022 in CSS by Edureka
• 13,620 points
1,373 views
0 votes
0 answers

horizontal line and right way to code it in html, css

I need to draw a horizontal line ...READ MORE

Jul 22, 2022 in CSS by Edureka
• 13,620 points
343 views
0 votes
1 answer

when declaring css styles, what is the meaning of .classA.classB (two class names with a dot in the middle and no space)

The first example (space-separated classes) is a ...READ MORE

answered Jun 28, 2022 in CSS by Edureka
• 12,690 points
755 views
0 votes
0 answers

How to make a back-to-top button using CSS and HTML only?

I want to scroll down and up ...READ MORE

Jun 30, 2022 in CSS by Edureka
• 13,620 points
529 views
0 votes
2 answers

Define a SQL query? What is the difference between SELECT and UPDATE Query? How do you use SQL in SAS?

HI.. SQL is Structured Query Language, which is ...READ MORE

answered Aug 8, 2020 in PHP by anonymous
10,564 views
0 votes
1 answer

Using/Handling colon inside a JSF generated HTML element ID in CSS selector

Yes, you can.  Just Backslash (\) the colon.  Like ...READ MORE

answered Nov 14, 2018 in Others by DataKing99
• 8,250 points
2,861 views
0 votes
1 answer

What is a css selector and where is it used?

CSS Selector is a combination of element ...READ MORE

answered Nov 21, 2018 in Data Analytics by Kalgi
• 52,350 points
945 views
0 votes
1 answer

What is the difference between span and div?

The div should be used to wrap sections of ...READ MORE

answered Jan 16, 2020 in Web Development by Niraj

edited Jan 21, 2020 by Niroj 3,669 views
0 votes
1 answer

How to build a special polygon (a kite shape) with HTML & CSS only?

I made two divs, one for Arc ...READ MORE

answered May 28, 2022 in CSS by Edureka
• 12,690 points
1,556 views
0 votes
1 answer

CSS to make HTML page footer stay at bottom of the page with a minimum height, but not overlap the page

A simple solution is to make the ...READ MORE

answered Jun 21, 2022 in CSS by Edureka
• 12,690 points
4,240 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP