Mfw trying to center something in css

mfw trying to center something in css

Other urls found in this thread:

classicdoom.com/
doom2.net/
twitter.com/NSFWRedditGif

>left: 50%;
>position: absolute;
>transform: translatex(-50%);
>mfw

>margin : 0
:^)

kys

Use 2 nested flexboxes

css, javascript, html5, bootstrap, jquery etc... is cancer

In 10 years time we'll maybe progress to have sites as good as flash sites were 10 years ago.

>text-align:center;
>margin:auto;

>tfw Apple swift is a bad copy of AS3
>tfw Apple killed AS3 and can't make good clone
KYS Apple

When did this
something
become hotter than this
something
?

1997 called and asked for their shitty markup back... sheesh. Just because youre a brainlette doesn't mean everything is hipster shit.

Center tag was for text alignment, in other words inline content.

For centering blocks use margin-left and right

The whole point is to use external styles that can be reused and therefore only get downloaded once for all your pages.

Ugh. CSS is such a shitshow. Something like flexbox should have been in the very first version. It's absurd that it took them years to even begin doing centering right.

flash was never good. early 90s web design is the pinnacle of practicality and ease of use, see: classicdoom.com/ the internet has only gotten worse since then.

Old DOOM sites are kino

doom2.net/

Ugly solution

There is a jQuery plugin for that.

>mfw it looks different in firefox, chrome, ie and safari

Thank fuck I'm not a web designer and have to deal with those things.

Because of ~semantic markup~. HTML tags should describe what the element is, not how it's styled/presented.
It's popular with hipster dipshits, but it's still a good idea.

display:flexbox is your friend

that won't work for 90% of shit

yea but his whole point is why can't css have some shit like "position:center;" and be done with it.
centering a 20x20 pixel box is fucking retarded you have to margin 50% then cut off 10px of the opposite margin or some ghetto stupid shit

flexbox nigga

>display: flex;
doesn't work
>align-items: center;
doesn't work
>justify-content: center;
doesn't work
kill self

Don't centre the thing on the website, centre the website on the thing

For block elements:
margin: 0 auto;


For absolute elements:
position: absolute;
left: 0;
right: 0;
margin: 0 auto;


Old-school way:
position: absolute;
width: 300px;
left: 50%;
margin-left: -150px; /* width / 2 */

BECAUSE
CSS
IS
AWESOME

nope

Because CSS is an awful joke, and web browsers weren't designed to display web pages.

Works on Firefox desktop and mobile. Good enough for me!

If anything takes more than 5 min to figure out in CSS stop.
Throw it into a and you're done.

I hate UI shit. Backend is bae. Can't spell backend without bae.

@mixin centered {
left: 50%;
position: absolute;
transform: translatex(-50%);
}

.shit-to-center {
@include centered;
}

width: 50%
margin: auto

Wow that was hard.

>tfw this shit works like 2% and no one can ever explain why

ITT: "I don't know how to use flexbox"

tfw perfect centering on my site after several months of trial and error

.center { text-align: center;}

centered text

>this is what webdevs do all day

Because for some reason web browsers are never ever suppoused to show compile/runtime errors when someone shoves literal gabage into it, so now we need to idiot-proof everything and disallow situations where someone puts two center tags right next to each other