Center Text and content on Sela theme

Steigs89
(@steigs89)

8 years, 5 months ago

I am trying to center the text on my worpress site so its more in the center of the screen but not scrunched. Right now all of the content is off to the left. I would like the content to be more in the center. I don’t want it to squeeze when I move it. Is it possible to change the whole themes Margins to fit this so that the content is more in the center?

http://tusdyes.org

Here is my website everything is on the left and no matter what CSS code I enter I cant change it. Ay help would be appreciated. Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)

Moderator Kathryn Presner
(@zoonini)

8 years, 5 months ago

Could you provide a link to an example page or post where the content looks “scrunched” and to the left? I spot-checked your site but couldn’t find anything that looked like that. Thanks!

Thread Starter Steigs89
(@steigs89)

8 years, 5 months ago

.content-wrapper .content-area {
float: center;
margin: -15;
width: 1120px;
}

right now I have this in my css to make the site so the text goes all the way across and it looks nice but it makes my site not mobile responsive any more the text keeps going.

Thread Starter Steigs89
(@steigs89)

8 years, 5 months ago

If you add auto to the margin it makes it mobile responsive. I am using the Sela theme and the and content is all along the left but I want everything to be more centered like I have it now. If I remove that css it goes back to all on the left

Thread Starter Steigs89
(@steigs89)

8 years, 5 months ago

I want the site to be how I have it now and mobile responsive I guess is what I am looking for. I like having the content stretched and centered which is what the .content-wrapper css is doing to make my site look like that
Moderator Kathryn Presner
(@zoonini)

8 years, 4 months ago
Your CSS is overriding the theme’s responsive styles because it’s not in a media query, so it’s affecting all sizes of screens.

Try putting your CSS in a media query so it doesn’t affect smaller screens. So for example, replace your existing CSS with something like:
```
@media screen and (min-width: 1200px) {
  .content-wrapper .content-area {
    width: 1120px;
  }
}
```
I’d suggest removing these lines as they are not valid CSS:
```
float: center;
  margin: -15;
```
Elements cannot be floated “center” (find valid float values here) and margin is missing a unit so it has no effect.

You can learn more about using media queries that target certain screen sizes here:

http://en.support.wordpress.com/custom-design/custom-css-media-queries/
http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries

Viewing 5 replies - 1 through 5 (of 5 total)

The topic ‘Center Text and content on Sela theme’ is closed to new replies.

Tags