Help - Search - Members - Calendar
Full Version: Increase blog body width
Forums > Resource Center > Support Center > Blogger Support > Blogger Resolved Topics
noi_rocker
May 6 2006, 09:59 AM
Hi,
I am new to blogger and I am not really used to html code.

This is my code for current skin:

CODE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Simply Gorgeous</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.blogentry {
    background-position:
    center top;
    border-left:2px solid #A86C38;
    border-right:2px solid #A86C38;
    border-top:2px solid #881438;
    border-bottom:2px solid #881438;
    font-family: Trebuchet MS;
    font-size: 11px;
    color:#FFFFFF;
    text-decoration: none;
    background-color:#cc99ff;
    
}
body {
    background: #000000 url('http://img.photobucket.com/albums/v129/cutieidah/background-purplestars.jpg');
   scrollbar-face-color:#996699;
   scrollbar-arrow-color:#990066;
   scrollbar-shadow-color:#990066;
   scrollbar-highlight-color:#990066;
   scrollbar-3dlight-color:#000000;
   scrollbar-darkshadow-color:#000000;
   scrollbar-track-color:#000000;}
}
-->
</style>
<style type="text/css">
<!--
.blognav {
    font-family: "Trebuchet MS", Helvetica, Times;
    font-size: 11px;
    color: #000000;
    text-decoration: none;
    background-color: #cc99ff;
    text-align: center;
    border-left:2px solid #881438;
    border-right:2px solid #881438;
    border-top:2px solid #A86C38;
    border-bottom:2px solid #A86C38;
}
a:link {
    font-family: "Trebuchet MS", Helvetica, Times;
    font-size: 11px;
    font-weight: none;
    color: #996699;
    text-decoration: none;
    cursor: crosshair;
}
a:hover {
    font-family: "Trebuchet MS", Helvetica, Times;
    font-size: 11px;
    font-weight: normal;
    color: #881438;
    text-decoration: none;
    cursor: crosshair;
    font-variant: small-caps;
    background-color: #996699;
}
a:visited {
    font-family: "Trebuchet MS", Helvetica, Times;
    font-size: 11px;
    font-weight: normal;
    color: #000000;
    text-decoration: none;
    cursor: crosshair;
    background: #996699;
}
-->
</style>
</head>

<noembed><xmp>
<body>
</xmp></noembed>
<div id="Layer1" style="position: absolute; width: 551; height: 622; z-index: 1; left: 351; top: 34" class="blogentry">
  <p align="center">
  <img border="0" src="http://img.photobucket.com/albums/v129/cutieidah/simplygorgeous.jpg">
  </p>
  <Blogger>
   <BlogDateHeader>
        
<BlogDateHeader>
        
  <h4></h4>
  <p align="center"><font size="4"><$BlogDateHeaderDate$>&nbsp;</font></p>
    </BlogDateHeader>
    <p align="center"><BlogItemTitle>
   <a href="<$BlogItemPermalinkURL$>"><font size="3"><$BlogItemTitle$>
   </a></BlogItemTitle></font></p>

    <p align="center"><$BlogItemBody$></font>
  <p align="center"><small><$BlogItemAuthor$>
  is just simply gorgeous <$BlogItemDateTime$></small><br>

   <p>
</Blogger>

</div>

<div id="Layer2" style="position: absolute; width: 200; height: 550; z-index: 2; top: 35; left: 50" class="blognav">

<h1 class="blognav"><b><font size="3" color="#990099">The Laydee</font></b></h1>
<p align="center"><font color="#FFFFFF">all about you...</font></p>


<h1 class="blognav"><b><font size="3" color="#990099">Recent</font></b></h1>
<p align="center">
<BloggerPreviousItems>
<a href="<$BlogItemPermalinkURL$>">
<$BlogPreviousItemTitle$>
</a><br>
</BloggerPreviousItems></p>

  <h1 class="blognav"><b><font size="3" color="#990099">Archives</font></b></h1>
<p align="center"><BloggerArchives>
  <a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a>
</BloggerArchives>

<h1 class="blognav"><b><font size="3" color="#990099">Tagboard</font></b></h1>
<p align="center"><font color="#FFFFFF">place your tagboard code here!</font></p>

<h1 class="blognav"><b><font size="3" color="#990099">Links</font></b></h1>
<p align="center">
<a href="http://bla" target="_blank">link1</a><br>
<a href="http://bla" target="_blank">link2</a><br>
<a href="http://bla" target="_blank">link3</a></p>
  
<h1 class="blognav"><b><font size="3" color="#990099">Read</font></b></h1>
<p align="center">
<a href="http://bla" target="_blank">Friend 1</a><br>
<a href="http://bla" target="_blank">Friend 2</a><br>
<a href="http://bla" target="_blank">Friend 3</a></p>
  
<h1 class="blognav"><b><font size="3" color="#990099">Credits</font></b></h1>
<p align="center"><font color="#FFFFFF"><b>Blog Layout By:</b><a href="http://cutieidah.blogspot.com" target="_blank"> Frina</a> <br>
<b>Picture by:</b> Getty Images<br>
</div>
<!-- Get awesome <a href="http://www.blogskins.com/">blog templates</a> like this one from from BlogSkins.com -->
</html>


I would like to know how and where to change the size of the blog body. Its too narrow for me as my entries are pretty long.

Sorry if this questions sounds stupid:p

Thank you.
moorepocket
May 6 2006, 09:51 PM
set width to this class, .blogentry.
noi_rocker
May 7 2006, 07:43 AM
Thank you! That work really well. I am also trying to shift the left side bar more towards the left. Is it possible?

Weirdly, I am unable to insert an tittle to my blog entries. The space to write them is not there. Why is that?

Thank u for your help.
moorepocket
May 8 2006, 12:56 PM
find this
QUOTE
<div id="Layer2" style="position: absolute; width: 200; height: 550; z-index: 2; top: 35; left: 50" class="blognav">

and change the left.
noi_rocker
May 10 2006, 07:07 PM
Thanks! I have finally figured it out! You are a genius!
moorepocket
May 10 2006, 08:39 PM
no problem.
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.