how to make my right side bar move to the left

Forum » Blogger Discussion / Blogger Templates » how to make my right side bar move to the left

Started by:

spiko_punk
Date: 02 Apr 2008 18:34
Number of posts: 1

Summary:

i got this shrek template and edited it but i didnt like the sidebar on the right. how do i put it on the left side of e page? and also as u notice the words are overlapping the lapping the picture, i wanna noe how to edit the aligning and all. thank you sooo much. here a copy of e xml blogger template

Unfold All Fold All More Options

Fold

how to make my right side bar move to the left

spiko_punk 02 Apr 2008 18:34

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
<head>
<b:include data='blog' name='all-head-content'/>
<title><data:blog.pageTitle/></title>
<b:skin><![CDATA[

#navbar-iframe {
display: none;
}

/* Variable definitions
====================
<Variable name="bgColor" description="Page Background Color"
type="color" default="#ffffff" value="#ffffff">
<Variable name="textColor" description="Text Color"
type="color" default="#624324" value="#624324">
<Variable name="linkColor" description="Link Color"
type="color" default="#A31D04" value="#A31D04">

body {
background: $bgColor url(http://www.imagehosting.com/out.php/i1628017_bg1451280x964.jpg) top center repeat-y;
margin: 0;
padding: 0;
font: x-small Verdana, Arial;
text-align: center;
color: $textColor;
font-size/* */://small;
font-size: //small;
}
a:link {
color: $linkColor;
}
a:visited {
color: $linkColor;
}
a img {
border-width: 0;
}

#outer-wrapper {
font: $bodyFont;
}

/* Header
---------— */
#header-wrapper {
margin: 0;
padding: 0;
text-align: left;
}

#header {
width: 862px;
margin: 0 auto;
color: $headerTextColor;
padding: 100px 0 0;
font: $headerFont;
}

h1.title {
padding: 0;
margin: 0 0 20px;
font-weight: lighter;
font-size: 90%;
}

h1.title a {
color: $headerTextColor;
text-decoration: none;
}

#header .description {
display: block;
margin: 70px 0 0;
padding: 0;
font-size: 40%;
color: #946338;
}

/* Content
---------— */

.clear {
clear: both;
}

#outer-wrapper {
background:url(http://www.imagehosting.com/out.php/i1628017_bg1451280x964.jpg) no-repeat fixed center left;
}

#content-wrapper {
width: 860px;
margin: 50px auto 0 auto;
padding: 0;
text-align: left;
border-top: 0;
}
#main-wrapper {
margin-left: 14px;
width: 558px;
float: left;
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 {
margin-right: 14px;
width: 250px;
float: right;
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, h3 {
margin: 0;
}

/* Posts
---------— */
.date-header {
margin: 1.5em 0 0;
font-weight: normal;
color: $dateHeaderColor;
font-size: 100%;
}
.post {
margin: 0 0 1.5em;
padding-bottom: 1.5em;
}
.post-title {
margin: 0;
padding: 0;
font-size: 125%;
font-weight: bold;
line-height: 1.1em;
}
.post-title a, .post-title a:visited, .post-title strong {
text-decoration: none;
color: $textColor;
font-weight: bold;
}
.post div {
margin: 0 0 .75em;
line-height: 1.3em;
font-style:italic;
}
p.post-footer {
margin: -.25em 0 0;
font-size: 83%;
}

.post-footer .span {
margin-right: .3em;
}
.comment-link {
margin-left: .3em;
}
.post img {
padding: 4px;
}
.post blockquote {
margin: 1em 20px;
}
.post blockquote p {
margin: .75em 0;
}

/* Comments
---------— */
#comments h4 {
margin: 1em 0;
color: $dateHeaderColor;
}
#comments h4 strong {
font-size: 110%;
}
#comments-block {
margin: 1em 0 1.5em;
line-height: 1.3em;
}
#comments-block dt {
margin: .5em 0;
}
#comments-block dd {
margin: .25em 0 0;
font-style:italic;
}
#comments-block dd.comment-footer {
margin: -.25em 0 2em;
line-height: 1.4em;
font-size: 78%;
}
#comments-block dd p {
margin: 0 0 .75em;
}

.deleted-comment {
font-style:italic;
color:gray;
}

.feed-links {
clear: both;
line-height: 2.5em;
}

#blog-pager-newer-link {
float: left;
}

#blog-pager-older-link {
float: right;
}

#blog-pager {
text-align: center;
}

/* Sidebar Content
---------— */
.sidebar h2 {
margin: 1.6em 0 .5em;
padding: 4px 5px;
font-size: 100%;
color: $sidebarTitleTextColor;
}

.sidebar ul {
margin: 0;
padding: 0;
list-style: none;
}
.sidebar li {
margin: 0;
padding: 0 0 .5em 15px;
text-indent: -15px;
line-height: 1.5em;
}
.sidebar {
color: $textColor;
line-height:1.3em;
}
.sidebar .widget {
margin-bottom: 1em;
}

.sidebar .widget-content {
margin: 0 5px;
}

/* Profile
---------— */
.profile-img {
float: left;
margin: 0 5px 5px 0;
padding: 4px;
}

.profile-data {
margin:0;
text-transform:uppercase;
letter-spacing:.1em;
font-weight: bold;
line-height: 1.6em;
font-size: 78%;
}

.profile-datablock {
margin:.5em 0 .5em;
}

.profile-textblock {
margin: 0.5em 0;
line-height: 1.6em;
}

]]></b:skin>
</head>

<!— skip links for text browsers —>
<span id='skiplinks' style='display:none;'>
<a href='#main'>skip to main </a> |
<a href='#sidebar'>skip to sidebar</a>
</span>

<!— spacer for skins that want sidebar and main to be the same height—>
<div class='clear'> </div>

</div> <!— end content-wrapper —>

</div></div> <!— end outer-wrapper —>
</body>
</html>

Reply Options

Unfold how to make my right side bar move to the left by

spiko_punk, 02 Apr 2008 18:34

New Post

Beautiful Beta

Exploring the beauty of Blogger

Welcome

Membership

Browse

Forum

Tag Cloud

Add a new page

Other interesting sites

Netboard

The Backrooms-P

DDSCAT

THIS WIKI CLOSED