I want to add br tag for mobile view resolution like 320px - 480px. I have tried margin top , bottom but not working. So please help me.
I want add br tag in between these two anchor tag. following two a tag like this.
<a class="ww" href="counseller.html">Career Counsellor</a>
<a class="xx" href="mentors.html"> Career Mentor</a>
When you create a line break using 'Shift+Enter', there is a so-called 'br' tag that gets automatically inserted in the code. In order to remove it, you simply need to hide this tag and target the devices or screen widths where you want to hide it.
<br>: The Line Break element. The <br> HTML element produces a line break in text (carriage-return). It is useful for writing a poem or an address, where the division of lines is significant.
It is a bad practice to use <br> to separate paragraphs of text. Instead, we should use the <p> tag.
You can't change the height of <br> tag as its not an HTML element, it is just an instruction which enforces a line break. br does not take up any space in the page. There is a way by which you can increase line break between lines, is by putting multiple br tags.
Another approach would be not to use <br />
tag but to apply block view property and apply margins on the a class only on mobiles with media queries! This way you would not need to add additional br tags, it would be much easier to handle later.
You can use media query
The class mobile
is applied to the <br />
. When the width
of the browser is less than 320px, the class inside the media query will be applied and the element is shown.
.mobile {
display: none;
}
@media (max-width: 320px) {
.mobile {
display: block;
/* Add other properties here */
}
}
<a class="ww" href="counseller.html">Career Counsellor</a>
<br class="mobile" />
<a class="xx" href="mentors.html"> Career Mentor</a>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With