I want to center my div
and I use this method, but it makes my texts inside the div
blurry:
<!-- language: lang-css --> #div { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
is there any way to center my div
?
This text is blurred. Styling text in CSS is pretty easy and so is making it blurred. In this article, we are going to show you two easy methods that you can use to blur the text using CSS. The first method of creating a blurred text is to make the text transparent and then apply a blur effect using the text-shadow property.
Webkit for whatever reason likes to make the fonts swap from subpixel to standard antialiasing when doing css transforms. Personally, I’ve found the best way to fix this is to force standard antialiasing on the element which is being transformed.
Basically, certain JavaScripts seem to cause crazy font smoothing stuff to happen. On Wufoo’s site, they’ve got an image slider/fader at the top of the page, but every time it changes to a new slide, ALL of the text on the page temporarily changes to antialiased font-smoothing.
Add these styles around elements blocks which you are translating to fix the anti-aliasing, Translate Z-axis to have a zero value.
-webkit-font-smoothing: subpixel-antialiased; -webkit-transform: translateZ(0) scale(1.0, 1.0);
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