Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
I want the content to be shown like this but without <br> tag by using somehow in CSS. Something like this:
Hi <br><br><br><br><br><br><br><br><br><br> Hello <br><br><br><br><br><br><br><br><br><br> Bye
You can use <pre> tag if you need to target plain text.
<pre>
one
two
three
</pre>
Or, the CSS way white-space: pre; for other elements like <div>.
div {
white-space: pre;
}
<div>
one
two
three
</div>
You can use any of these css properties, but you must put the text into HTML tags, such as <p>, div, etc:
height
margin-top
margin-bottom
padding-top
padding-bottom
#midP{margin-top:50px;margin-bottom:20px;border:1px solid red;}
<p>Hi</p>
<p id="midP">Hello</p>
<p>Bye</p>
Related
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 months ago.
Improve this question
Does the properties/style of div class A overlap B in the below case?
<div class="A">
<div class="B">
</div>
</div>
Your question is not clear enough but most of the times, properties can 'overlap' or are inherited.
For eg., if we add a text in the div with class 'B' and add a CSS styling for the text to the div with class 'A', you will be able to see that the styling for the text is changed. Although, if you provide styles to the second div also, it would be considered for the styling of the text.
Please provide further context so I can help better.
.A {
color: blue;
}
<div class="A">
<div class="B">
this is a text
</div>
</div>
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 6 years ago.
Improve this question
How can I keep this two words on a single line:
<div align=right>hai</div>
<div align=center>hello</div>
I have already tried it but I didn't get any satisfactory preview.
Divs are block elements by default so they will appear on separate lines.
You can set them to inline by css: display:inline
Or use an inline element like or
<span align=right>hai</span>
<span align=center>hello</span>
I'm not sure I correcctly understand your question, but I'll try an answer anyway.
Let's say you have 2 words in a sentance :
<p>word1 word2</p>
and you want this 2 words to be, at any resolution, displayed beside each other.
Replace the space between this 2 words by (code for non-breaking space in HTML), and it will be displayed as a single entity :
<p>word1 word2</p>
If you wanted only DIV tag
Simply, use display:inline-block with DIV tag.
div {
display: inline-block;
}
<div align=right>hai</div>
<div align=center>hello</div>
Update
You can even use style attribute like below:
<div style="display:inline-block">hai</div>
<div style="display:inline-block">hello</div>
But, it's not a good practice...
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
Is there anyway I can display a div correctly with style code in the tag. For example I was wanting to have a div banner but Wordpress does not display the background color but it does show the text is there any way I can change it.
Example of what I was wanting todo.
<div id="Break" style="color:blue">
Test
</div>
You should use background-color instead of color.
<div id="Break" style="background-color:blue">
Test
</div>
You really shouldn't be adding styles in your html either, this should be;
index.php (or wherever you want to use it)
<div id="Break">
Test
</div>
style.css
#break{
background-color: blue;
}
Achieves exactly the same but is a much better way of doing it.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 7 years ago.
Improve this question
i have a code like bellow:
<div style="font-size:58px;"> Name <span style="font-size:18px; vertical-align:middle;">|</span> 2015-04-01 </div>
and then i have the result like this
but i want the span element a little bit higher like this
so please teach me how to do, Thank you very much.
Actually the span element technically is already in the middle. You can verify this by applying vertical-align:top;, vertical-align:bottom; or vertical-align:middle; on the span element.
Other than that, I’d recommend using
position:relative;
top:-.5em;
on the span. Use the em units to make it dependent on font size (although that doesn’t perfectly work because it’s dependent on the font size of the span element).
Demo:
<div style="font-size:58px;"> Name <span style="font-size:18px; vertical-align:middle;position:relative;top:-.5em;">|</span> 2015-04-01 </div>
Of course you can adjust the value as you please.
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 9 years ago.
Improve this question
My HTML is really simple, but for some reason, I am getting a strange overflow. I can't seem to understand where it is coming from and how to get rid of it.
This is my HTML:
<div class="labels">
<span ng-repeat="label in labels">{{label}}</span>
</div>
This is my CSS:
.labels {
width: 300px;
background: #AAFFEE;
}
The angular code I have is quite long (a long list of labels) but here is the gist of it:
angular.module('guy',[]).controller('Guy', function($scope) {
$scope.labels = [
'adding and subtracting',
'audio',
…
];
Here is a full Plunker.
Why do the <span> elements not wrap inside the <div>, but instead overflow?
There is no space between your words (which is why you had to add padding-right), so they’re all treated as one word. This is a side-effect of Angular removing spaces, which itself is a side-effect of Angular just not being very good.
Put a space in.
<div class="labels">
<span ng-repeat="label in labels">{{label}} </span>
</div>
Voilà