Ask coding questions

← Back to all posts
I've been having problems with the rendering of the tab.
svensk007 (58)

Inside of repl.it it looks just fine but when I open it in a new tab the Title text isn't centered anymore. I'm using @CoolCoderSJ's CSS Minimalist thing but the "page" class doesn't center the paragraph text either.

Answered by ch1ck3n (2054) [earned 5 cycles]
View Answer
Comments
hotnewtop
ch1ck3n (2054)

it is actually centered. it just uses margin-left: 20%;margin-right: 20%; so to make more "center", you just need to apply your own css.

so add style="margin-left: 50%;margin-right: 50%;" to all of your elements you want centered. the more the percent is the more "centered" it is.

or you could just use <center> tags.

svensk007 (58)

@ch1ck3n well I have a class named .center(use ctrl/cmd+f to find) and it uses text-align: center. Also for the pages it uses margin-left/right: 100px

svensk007 (58)

@ch1ck3n should I change it to margin-left/right: 50%?

ch1ck3n (2054)

@svensk007 try it! you never know whats gonna happen

ch1ck3n (2054)

@svensk007 in programming usually the most unexpected solutions are the best

svensk007 (58)

@ch1ck3n lol. well I found the problem under the first .page using ctrl+f the margin-left was set to 0px instead of like 100px or something but I'm still going to try your way.

Update: I tried using the center for the margin and it seemingly worked. But the class I made for centering text(that uses the text-align: center) still doesn't work...

ch1ck3n (2054)

@svensk007 perfect now can you please click the checkmark if it solved the problem

svensk007 (58)

@ch1ck3n yes I did it but the title text still doesn't center and I can't figure out why because I also need that class otherwise it wouldn't have worked anyway

Edit: I feel like repl.it is stopping me from marking my own comment

ch1ck3n (2054)

@svensk007 it stops me from marking my own too

svensk007 (58)

@ch1ck3n I simply fixed it with brute-force by changing the <h1> and <p> CSS

h1, p { text-align-center }

I mean it works but it just adds more CSS to the mix...

FloCal35 (668)

try adding float: center

.center {
	text-align: center;
        float: center;
}
FloCal35 (668)

also what the heck... that quote