WordPress.com

1. tobefree
   Member
   Dec 23, 2007, 5:29 AM

   Whenever I post images that are larger than 450px, they get cut off on the right side. Could someone please take a look at the code and tell me what I need to add and where to put it in order to have the images resized to 450px wide?

   body {
   font-size:62.5%;
   font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
   background-color:#E8E8E8;
   color:#000000;
   text-align:center;
   margin:0;
   padding:0;
   }

   #topbar {
   max-width:750px;
   height:25px;
   line-height:23px;
   background:#FFFFE6;
   overflow:hidden;
   border-bottom:1px black solid;
   margin:0;
   }

   #topbar a,#topbar {
   font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
   text-align:right;
   padding-right:5px;
   }

   #pagebar {
   width:750px;
   height:35px;
   border-bottom:1px black solid;
   margin:0;
   padding:0;
   }

   #pagebar a {
   font-family:"Trebuchet MS", Verdana, Arial, Sans-Serif;
   color:#333;
   font-size:1.4em;
   display:block;
   float:left;
   border-right:1px #CECECE solid;
   text-align:center;
   height:27px;
   padding:8px 15px 0;
   }

   #pagebar a:hover {
   background-color:#CECECE;
   text-decoration:none;
   }

   #pagebar li {
   list-style:none;
   }

   .entry {
   font-size:1.3em;
   font-family:Verdana;
   overflow:hidden;
   }

   #page {
   text-align:left;
   background-color:white;
   width:750px;
   border:0;
   margin:0 auto;
   padding:0;
   }

   #header {
   background-image:url('http://tobefree.files.wordpress.com/2007/12/head3.jpg');
   background-position:top left;
   background-repeat:no-repeat;
   border-bottom:1px black solid;
   height:140px;
   width:100%;
   background-color:#FFFFFF;
   margin:0 auto;
   padding:0;
   }

   #content {
   float:left;
   width:450px;
   margin:-70px 0 0;
   padding:0 0 20px 45px;
   }

   #content .entry {
   line-height:1.4em;
   }

   .alt {
   background-color:#f8f8f8;
   border-top:1px solid #ddd;
   border-bottom:1px solid #ddd;
   margin:0;
   padding:10px;
   }

   #footer {
   background-color:#eee;
   width:750px;
   clear:both;
   border-top:1px black solid;
   margin:0 auto;
   padding:0;
   }

   small {
   font-family:Verdana, Helvetica, Sans-Serif;
   font-size:0.9em;
   line-height:1.5em;
   }

   small.cats {
   text-transform:uppercase;
   font-family:Helvetica, Verdana;
   font-size:0.9em;
   }

   h1,h2,h3 {
   font-family:'Trebuchet MS', 'Lucida Grande', Verdana, Arial, Sans-Serif;
   font-weight:bold;
   }

   h1 {
   font-size:4em;
   text-align:center;
   padding-top:40px;
   margin:0;
   }

   .description {
   font-size:1.2em;
   text-align:center;
   margin-top:-5px;
   }

   h2 {
   font-size:1.8em;
   margin:30px 0 0;
   }

   h2.pagetitle {
   font-size:1.6em;
   margin-top:30px;
   text-align:center;
   }

   #sidebar h2 {
   font-family:Verdana, Sans-Serif;
   font-weight:normal;
   text-indent:10px;
   background-color:#5581C0;
   color:white;
   text-transform:uppercase;
   font-size:1em;
   margin:0;
   padding:3px 0;
   }

   h3 {
   font-size:1.3em;
   margin:30px 0 0;
   padding:0;
   }

   h1,h1 a,h1 a:hover,h1 a:visited,.description {
   text-decoration:none;
   color:#B0C7FF;
   }

   h2,h2 a,h2 a:visited,h3,h3 a,h3 a:visited {
   color:#333;
   }

   h2,h2 a,h2 a:hover,h2 a:visited,h3,h3 a,h3 a:hover,h3 a:visited,#sidebar h2,#wp-calendar caption,cite {
   text-decoration:none;
   }

   .entry p a:visited {
   color:#b85b5a;
   }

   .commentlist li,#commentform input,#commentform textarea {
   font:0.9em 'Lucida Grande', Verdana, Arial, Sans-Serif;
   }

   .commentlist li {
   font-weight:bold;
   list-style:none;
   margin:15px 0 3px;
   padding:5px 10px 3px;
   }

   .commentlist cite,.commentlist cite a {
   font-weight:bold;
   font-style:normal;
   font-size:1.1em;
   }

   .commentlist p {
   font-weight:normal;
   line-height:1.5em;
   text-transform:none;
   margin:10px 5px 10px 0;
   }

   .commentlist .avatar {
   float:right;
   border:1px solid #ddd;
   padding:2px;
   }

   p.about {
   text-align:center;
   background-color:#F8F8F8;
   font-size:1.2em;
   font-family:Arial, Verdana, Sans-Serif;
   }

   #commentform p {
   font-family:'Lucida Grande', Verdana, Arial, Sans-Serif;
   margin:5px 0;
   }

   .commentmetadata {
   font-weight:normal;
   font-size:1em;
   display:block;
   margin:0;
   }

   #sidebar {
   font:1.1em 'Lucida Grande', Verdana, Arial, Sans-Serif;
   width:200px;
   margin:-60px 0 0 530px;
   padding:20px 0 10px;
   }

   small,#sidebar ul ul li,#sidebar ul ol li,.nocomments,.postmetadata,blockquote,strike {
   color:#000000;
   }

   code {
   font:1.1em 'Courier New', Courier, Fixed;
   }

   #pagebar li.page_item {
   display:inline;
   }

   acronym,abbr,span.caps {
   font-size:0.9em;
   letter-spacing:.07em;
   cursor:help;
   }

   a,h2 a:hover,h3 a:hover {
   color:#000000;
   text-decoration:none;
   }

   a:hover {
   color:#147;
   text-decoration:underline;
   }

   #wp-calendar #prev a {
   font-size:9pt;
   padding-left:10px;
   text-align:left;
   }

   #wp-calendar a {
   text-decoration:none;
   display:block;
   }

   #wp-calendar caption {
   font:bold 1.3em 'Lucida Grande', Verdana, Arial, Sans-Serif;
   text-align:center;
   width:100%;
   }

   #wp-calendar th {
   font-style:normal;
   text-transform:capitalize;
   }

   #headerimg {
   height:140px;
   width:100%;
   background-image:url('images/blue_flower/head.jpg');
   margin:0;
   }

   .post {
   margin:0 0 30px;
   }

   .widecolumn .post {
   margin:0;
   }

   .postmetadata {
   clear:both;
   }

   .narrowcolumn .postmetadata {
   padding-top:5px;
   }

   .widecolumn .postmetadata {
   margin:30px 0;
   }

   #footer p {
   text-align:center;
   margin:0;
   padding:10px 0;
   }

   h3.comments {
   margin:40px auto 20px;
   padding:0;
   }

   p img {
   margin:0 5px;
   padding:0;
   }

   img.centered {
   display:block;
   margin-left:auto;
   margin-right:auto;
   }

   img.alignright {
   display:inline;
   margin:0 0 2px 7px;
   padding:4px;
   }

   img.alignleft {
   display:inline;
   margin:0 7px 2px 0;
   padding:4px;
   }

   .alignright {
   float:right;
   }

   .alignleft {
   float:left;
   }

   html>body .entry ul {
   margin-left:0;
   list-style:none;
   text-indent:-10px;
   padding:0 0 0 10px;
   }

   html>body .entry li {
   margin:7px 0 8px 10px;
   }

   .entry ul li:before,#sidebar ul ul li:before {
   content:"o ";
   }

   .entry ol {
   margin:0;
   padding:0 0 0 35px;
   }

   .entry ol li {
   margin:0;
   padding:0;
   }

   .postmetadata ul,.postmetadata li {
   display:inline;
   list-style-type:none;
   list-style-image:none;
   }

   #sidebar ul,#sidebar ul ol {
   margin:0;
   padding:0;
   }

   #sidebar ul li {
   list-style-type:none;
   list-style-image:none;
   margin-bottom:20px;
   }

   #sidebar ul p,#sidebar ul select {
   margin:4px 0 8px;
   }

   #sidebar ul ul,#sidebar ul ol,#sidebar ul div {
   background-color:#ffffff;
   border:0 #2E5D99 solid;
   padding:8px;
   }

   #sidebar ul div.textwidget ul {
   border:0;
   }

   #sidebar ul ul ul,#sidebar ul ol {
   background:transparent;
   border:none;
   margin:0 0 0 10px;
   padding:0;
   }

   #sidebar ul div div {
   background:transparent;
   border:none;
   margin:0;
   }

   ol li,#sidebar ul ol li {
   list-style:decimal outside;
   }

   #sidebar ul ul li,#sidebar ul ol li {
   margin:3px 0 0;
   padding:0;
   }

   #searchform {
   text-align:center;
   margin:10px auto;
   }

   #sidebar #searchform #s {
   margin-top:8px;
   width:115px;
   padding:2px;
   }

   #sidebar #searchsubmit {
   padding:1px;
   }

   .entry form {
   text-align:center;
   }

   select {
   width:130px;
   }

   #commentform input {
   width:170px;
   margin:5px 5px 1px 0;
   padding:2px;
   }

   #commentform textarea {
   width:100%;
   padding:2px;
   }

   #commentform #submit {
   float:right;
   margin:0;
   }

   .commentlist {
   text-align:justify;
   padding:0;
   }

   .nocomments {
   text-align:center;
   margin:0;
   padding:0;
   }

   #sidebar form {
   margin:0;
   }

   #wp-calendar {
   empty-cells:show;
   width:155px;
   margin:10px auto 0;
   }

   #wp-calendar #next a {
   padding-right:10px;
   text-align:right;
   }

   #wp-calendar td {
   text-align:center;
   padding:3px 0;
   }

   #wp-calendar td.pad:hover {
   background-color:#fff;
   }

   acronym,abbr {
   border-bottom:1px dashed #999;
   }

   blockquote {
   padding-left:20px;
   border-left:0 solid #ddd;
   margin:15px 30px 0 10px;
   }

   blockquote cite {
   display:block;
   margin:5px 0 0;
   }

   .center {
   text-align:center;
   }

   hr {
   height:1px;
   color:#AAAAAA;
   background-color:#AAAAAA;
   border:0;
   }

   a img {
   border:none;
   }

   .navigation {
   display:block;
   text-align:center;
   margin-top:10px;
   margin-bottom:30px;
   }

   #akismetwrap #akismetstats {
   margin:0 auto;
   }

2. thesacredpath
   Member
   Dec 23, 2007, 5:39 AM

   It's almost never quite as easy as changing one thing. The footer width would likely have to change, and header stuff, and there may be some repositioning of sidebars, etc. It can be sort of like a snowball rolling downhill.

   Perhaps one of the CSS guru's will pop in this evening, or perhaps tomorrow evening and have a look.

3. thesacredpath
   Member
   Dec 23, 2007, 5:44 AM

   Actually having reread your post, you want it to automatically resize images, and I'm virtually certain that is beyond what CSS can do, but hopefully a code warrior will pop in this evening or tomorrow evening.

Topic Closed

This topic has been closed to new replies.