Bloggeries

Go Back   Blog Forum - Bloggeries > Blogging Basics of the Blogosphere > Blogging Basics

Blogging Basics Come here to learn the basics of blogging.

Learn how to set up a blog, start blogging, produce quality content and use these forums as your internet marketing courses.

Reply
 
LinkBack Thread Tools Display Modes
  #1  
Old September 14th, 2009, 08:38 AM
Brand Spanking New Member
 
Join Date: Sep 2009
Posts: 1
iTrader: (0)
beebop is on a distinguished road
Default Centering Blog

Hi Guys
I'm new to Blogger and could do with some help on something that is really frustrating me! I am trying to get my blog to be centered in the middle of the screen / browser. I want it to be centered horizontally so that there is white space on the left and on the right.
On my screen (1440 x 900) it looks perfect using and internet explorer however it is aligned to the left on mozilla - argh! Likewise, on some friends laptops it looks fine, but on screens that are more "square" it aligns to the left again.
I have traulled the web but having no luck. Thought someone on here MUST be able to help! Thank you in advance
Here is part of the code (please let me know if you need any of the rest):

body {
background:$bgcolor;
margin:0;
color:$textcolor;
font:x-small Georgia Serif;
font-size/* */:/**/small;
font-size: /**/small;
text-align: center;
}
a:link {
color:$linkcolor;
text-decoration:none;
}
a:visited {
color:$visitedlinkcolor;
text-decoration:none;
}
a:hover {
color:$titlecolor;
text-decoration:underline;
}
a img {
border-width:0;
}
/* Header
-----------------------------------------------
*/
#header-wrapper {
width:900px;
margin:0 auto 0px;
border:
}
#header-inner {
background-position: center;
margin-left: auto;
margin-right: auto;
}
#header {
margin: 0px;
border: 0px solid $bordercolor;
text-align: center;
color:$pagetitlecolor;
}
#header h1 {
margin:0px 0px 0;
padding:0px 0px;
line-height:1.2em;
font: $pagetitlefont;
}
#header a {
color:$pagetitlecolor;
text-decoration:none;
}
#header a:hover {
color:$pagetitlecolor;
}
#header .description {
margin:0 0px 0px;
padding:0 0px 0px;
max-width:900px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: $descriptionfont;
color: $descriptioncolor;
}
#header img {
margin-$startSide: auto;
margin-$endSide: 600px;
}

/* Outer-Wrapper
----------------------------------------------- */
#outer-wrapper {
width: 900px;
margin-right: 0px;
margin-left: 0px;
margin-top: 0px;
margin-bottom: 0px;
padding:0px;
text-align:$startSide;
font: $bodyfont;
overflow:auto;
overflow-x:hidden;
}
#main-wrapper {
width: 620px;
padding: 20px;
float: $startSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}
#sidebar-wrapper {
width: 220px;
padding: 10px;
float: $endSide;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

/* Headings
----------------------------------------------- */
h2 {
margin:1.5em 0 .75em;
font:$headerfont;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color:$sidebarcolor;
}

/* Posts
-----------------------------------------------
*/
h2.date-header {
margin:1.5em 0 .5em;
}
.post {
margin:.5em 0 1.5em;
border-bottom:0px dotted $bordercolor;
padding-bottom:0px;
height:270px;
overflow:auto;
}
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}
.post h3 a, .post h3 a:visited, .post h3 strong {
display:block;
text-decoration:none;
color:$titlecolor;
font-weight:normal;
}
.post h3 strong, .post h3 a:hover {
color:$textcolor;
}
.post-body {
margin:0 0 .75em;
line-height:1.6em;
}
.post-body blockquote {
line-height:1.3em;
}
.post-footer {
margin:0;
color:$sidebarcolor;
text-transform:uppercase;
letter-spacing:.1em;
font: $postfooterfont;
line-height:0;
}
.comment-link {
margin-$startSide:.6em;
}
.post img {
padding:4px;
border:0px solid $bordercolor;
}
.post blockquote {
margin:1em 20px;
}
.post blockquote p {
margin:.75em 0;
}
Digg this Post!Add Post to del.icio.usReddit! Stumble this Post!Twit this!
Reply With Quote

Don't Like Ads?? Register as a Member and These Ads Will Disappear!

-->
  #2  
Old September 14th, 2009, 04:39 PM
Nathan's Avatar
Resident Experiment Inventor
Administrator
 
Join Date: Mar 2008
Location: USA
Posts: 2,823
iTrader: (0)
Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of Nathan has much to be proud of
Default Re: Centering Blog

This is how you do it:

Located the code that says:

Code:
#outer-wrapper {
width: 900px;
margin-right: 0px;
margin-left: 0px;
margin-top: 0px;
margin-bottom: 0px;
padding:0px;
text-align:$startSide;
font: $bodyfont;
overflow:auto; 
overflow-x:hidden; 
}
Change it to:
Code:
#outer-wrapper {
width: 900px;
margin: 0 auto;
padding:0px;
text-align:$startSide;
font: $bodyfont;
overflow:auto; 
overflow-x:hidden; 
}
That's all it takes! Let me know if you have any trouble.
__________________
+ Experiment Garden is my current blog for experiments and my project portfolio.
+ My first blog was Inkweaver Review. Now I work on Bookflavor

+ You should try out Duck Duck Go
Digg this Post!Add Post to del.icio.usReddit! Stumble this Post!Twit this!
Reply With Quote
  #3  
Old September 19th, 2009, 06:34 AM
Blogger in Training
 
Join Date: Sep 2009
Posts: 24
iTrader: (0)
Robin is on a distinguished road
Default Re: Centering Blog

I don't know the code too ,but I want to learn it.
Digg this Post!Add Post to del.icio.usReddit! Stumble this Post!Twit this!
Reply With Quote
  #4  
Old September 19th, 2009, 01:13 PM
Bloggeries's Avatar
Bonafied Blogaholic
Administrator
 
Join Date: Dec 2006
Location: Blogosphere at Large!
Posts: 6,364
iTrader: (1)
Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute Bloggeries has a reputation beyond repute
Default Re: Centering Blog

Robin - I'm not very good at coding but you can learn sorta by doing somewhat simple little tweaks here and there in the codes that exist.

Truth be told, I'm envious of those who can code really well or even at all!
__________________
Web's best deal on blog hosting - 25% Off + we pay you $20US, why not!?
Stop Having a Boring Life Travel Blog


Digg this Post!Add Post to del.icio.usReddit! Stumble this Post!Twit this!
Reply With Quote
  #5  
Old September 29th, 2009, 01:50 AM
jdjohnson21's Avatar
Blogger in Training
 
Join Date: Sep 2009
Posts: 16
iTrader: (0)
jdjohnson21 is on a distinguished road
Default Re: Centering Blog

Great thread... I Have been having the same problem.

thanks guys
Digg this Post!Add Post to del.icio.usReddit! Stumble this Post!Twit this!
Reply With Quote
Reply

Bookmarks

Tags
align , center , centering

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On



All times are GMT -4. The time now is 08:35 AM.

Powered by vBulletin® Version 3.8.1
Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
SEO by vBSEO 3.3.0 RC1

Blog Directory | Submit Blog | Latest Blogs | Blogging Blog | Blog Reviews | Blog Forum