How to design progress bar with text of its value? [closed] - html

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
How can I create something like this progress bar?

Simply nest a div in another div and set the width of the nested div to the progress percentage. You can align the text with text-align:center.
.progress-bar{
background-color:#EAECEF;
}
.progress-bar .bar{
background-color:#314EFF;
color:white;
text-align:center;
}
<div class="progress-bar">
<div class="bar" style="width:49%">
49%
</div>
</div>

Related

Menu covering header [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
My menu background is covering header and content (those tables) when you make your browser smaller (its responsive menu). How do I make it so that header and tables will move down a bit so its not hidden behind menu bg?
HTML: https://paste.ee/p/ww1CT
CSS: https://paste.ee/p/TEmU5
Instead of
nav {
position:fixed;
}
make it sit relative to the other content
nav {
position:relative;
}

Need the footer at the bottom [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
I have a problem with my website , I cannot figure out why the footer does not go down.
position:fixed is your friend. Check this fiddle:
I just updated this CSS block:
.footer-id{
padding-top:1%;
position:fixed;
bottom:0px;
left:0px;
width:100%;
}
With that rules above I told the browser to fill the full with and to put it non scrolling to the buttom.

Border crossing through links when the liks are floated to the left [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
So, I am coding website and I have a toolbar with links and some text floating to he left and the container (the class names toolbar-container) has a border on the bottom but the border is crossing through the text. I want everything to look the same, but I want the border below. The repository containing all the code is at: https://github.com/DigitalBlast/Digital-Blast/
HTML:
<div class="toolbar-container">
<div class="toolbar-container-logo">
Digital<span class="toolbar-container-logo-sub">Blast</span>
</div>
<div class="toolbar-container-home" onclick="window.location.href='home/index.html'">
<h4>Home</h4>
</div>
<div class="toolbar-container-software" onclick="window.location.href='software/index.html'">
<h4>Software</h4>
</div>
<div class="clear-left"></div>
</div>
CSS:
.clear-left {
clear: left;
}

Centering <td>'s in a <div> [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I am fixing up a website for a tech night at my school. The navbar was on the side which isn't my favorite view for the bar so I put it on top, but I can't get the table data or menu to center in the div.
http://jsfiddle.net/ksta1584/c88qswsx/
<a href="http://jsfiddle.net/ksta1584/c88qswsx/">Link<a/>
I would also like instead of the lines disappearing when you scroll over that they are all in equally sized boxes and the boxes sort of "pop" out. I'm not sure how to do that and can't get the border to appear.
Do this in your .nav:
.nav {
width: 100%;
text-align: center;
position:relative;
top:35%;
}
Put margin:0 auto into your .nav rule

The footer is behind the main content, I think it needs a clear:both, but where? [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
I think this needs a clear:both somewhere, but where?
The situation: the footer is sitting behind the main content div.
Right now the footer is near the bottom of the page only because of a minimum-height on the main-content div.
Here's how its looking
Seems to work well removing
.details {
height: 54px;
}