There are many ways to Hide text with CSS, here are some CSS codes that you can use to hide a text within a particular markup just by using CSS.
So some tricks How to Hide Text with CSS, hopefully, the readers helped with writing from this ARBloggerLab.
Method 1
.hide-text {
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
}
Way 2
.hide-text{
position: absolute;
top: -9999px;
left: -9999px;
}
Way 3
.hide-text {
text-indent: -9999em;
outline: 0;
}
.hide-text {
height: 0;
overflow: hidden;
position: absolute;
}
.hide-text {
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
height: 1px;
width: 1px;
overflow: hidden;
}
Method 4: On the button
.submitbutton {
display:block;
width:100px; height:25px;
background-image:url(image.jpg); background-repeat:no-repeat;
text-indent:-999px;
font-size:0px; line-height:0;
}
Method 5: Replace header text with image
h1 {
text-indent:-9999px;
margin:0 auto;
width:400px;
height:100px;
background:transparent url("images/logo.jpg") no-repeat scroll;
}
So some tricks How to Hide Text with CSS, hopefully, the readers helped with writing from this ARBloggerLab.