Oi Pessoal, tudo bem? Sou novo aqui e já preciso de ajuda, hehe. É o seguinte, coloquei um template novo no meu blog (uso como portfólio). Estou customizando, mas não consigo resolver um problema: as imagens dos thumbnails estão distorcidas. Mexi no trecho abaixo, mas só muda e continua distorcendo: :wacko: .post img {
height:168px;
width:213px;
}
O blog é esse douglasportifolio.blogspot.com
O código completo:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' 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>
<!--[if IE]>
<script defer type="text/javascript" src="http://askerakbar.110mb.com/jquery/bgsleight.js"></script>
<![endif]-->
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
<b:skin><![CDATA[
/*-----------------------------------------------
Name : MyShowcase
Designer : AskerAkbar
URL : www.BloggerThemes.net
MyShowcase blogger theme comes under a Creative Commons license.
They are free of charge to use as a theme for your blog and
you can make changes to the templates to suit your needs.
and please you must keep the footer credit links intact which
provides credit to its authors.
-----------------------------------------------*/
#navbar-iframe {
display:none!important;
}
* {
margin:0;
padding:0;
list-style:none;
border:none;
vertical-align:baseline;
outline:none;
}
.clear {
clear:both;
}
a:active {
outline:none;
}
a:focus {
moz-outline-style:none;
}
body {
background:#1c242e url(http://i474.photobucket.com/albums/rr109/coolwebbies/Premium/bodybg.jpg);
background-repeat:repeat-x;
margin:0;
color:#4b6d8e;
font:11px/22px Arial,Helvetica,sans-serif;
}
a {
color:#4b6d8e;
text-decoration:none;
}
a:hover {
color:#539de8;
text-decoration:underline;
}
a img {
border-width:0;
}
/* header-wrapper
-----------------------------------------------------------------------------------*/
#header-wrapper {
width:980px;
height:149px;
margin:0 auto;
}
#head-inner {
width:400px;
background-position:left;
margin-left:auto;
margin-right:auto;
float:left;
}
#header {
text-align:left;
margin-top:0;
}
#r_head {
width:480px;
height:60px;
float:right;
padding-top:50px;
}
#header h1 {
color:#505c6d;
font-family:Arial;
font-weight:lighter;
font-style:normal;
font-size:30px;
margin-top:60px;
}
#header a {
color:#505c6d;
text-decoration:none;
}
#header a:hover {
}
#header .description {
font-family:Arial;
font-weight:lighter;
font-style:normal;
font-size:11px;
}
#header img {
margin-left:auto;
margin-right:auto;
}
/* menu
-----------------------------------------------------------------------------------*/
.menu {
height:20px;
width:980px;
font:10px arial;
padding:10px 0 0;
text-transform:uppercase;
text-align:center;
}
.menu li {
float:left;
float:left;
display:block;
margin:auto 20px;
list-style:none;
}
.menu li a:hover {
text-decoration:none;
}
/* wrappers
-----------------------------------------------------------------------------------*/
#outer-wrapper {
margin:0 auto;
text-align:left=;
width:980px;
}
#content-wrapper {
margin-top:25px;
}
#main-wrapper {
float:left;
overflow:hidden;
width:800px;
margin-right:18px;
background:#1A2129;
border:1px solid #10151C;
}
#sidebar-wrapper {
width:441px;
float:left;
word-wrap:break-word;
overflow:hidden;
}
/*post
-----------------------------------------------------------------------------------*/
.post {
overflow:hidden;
width:800px;
}
.post h3 {
margin:0;
padding:0;
font-size:18px;
font-weight:lighter;
margin:20px 0 0 20px;
}
.post h3 a,.post h3 a:visited,.post h3 strong {
display:block;
}
.post h3 strong,.post h3 a:hover {
color:#539de8;
}
.post-body {
padding:20px 20px 0;
}
.comment-link {
color:#5b6065;
margin:0 0 10px 185px;
float:right;
bottom:10px;
position:absolute;
background:url(http://i474.photobucket.com/albums/rr109/coolwebbies/Premium/CommentIcon.png);
font-size:10px;
text-align:center;
width:31px;
height:22px;
}
.post-body blockquote {
}
.post blockquote {
font-style:italic;
font-size:13px;
padding:10px 20px;
}
.post blockquote p {
}
.post img {
}
.post-meta {
padding:0 0 0 20px;
background:#1C242E;
margin-top:40px;
border:1px solid #273444;
border-right:0;
border-left:0;
}
.post-labels {
padding:0 0 0 20px;
}
/*comments
-----------------------------------------------------------------------------------*/
#comments {
padding-left:18px;
padding-right:18px;
margin-top:50px;
}
#comments h4 {
font-size:13px;
border-top:1px solid #202832;
padding-top:10px;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
padding-left:20px;
}
#comments-block .comment-author {
margin:.5em 0;
margin-top:25px;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height:1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}
#blog-pager-newer-link {
float:left;
}
#blog-pager-older-link {
float:right;
}
#blog-pager {
text-align:center;
padding:0px 20px 40px 20px;
}
#blog-pager-older-link,#blog-pager-newer-link {
background:#1C242E;
padding:2px 8px;
border:1px solid #273444;
}
.feed-links {
display:none;
}
/*sidebar content
-----------------------------------------------------------------------------------*/
#sidebar-right {
width:218px;
float:left;
margin-left:4px;
}
#sidebar-left {
width:218px;
float:left;
}
#sidebar-bottom {
width:441px;
float:left;
}
.sidebar h2,.footer h2 {
background:#1C242E;
border:1px solid #273444;
font-size:13px;
padding:3px 0 3px 20px;
border-left:0;
border-right:0;
}
.sidebar {
font-size:13px;
}
.sidebar ul {
list-style:none;
margin:0;
padding:0;
}
.sidebar li {
line-height:1.8em;
}
.sidebar .widget-content {
padding:10px 0 10px 20px;
}
.sidebar .widget {
background:#1A1E27;
border:1px solid #10151C;
margin-bottom:5px;
}
/*footer-wrapper
-----------------------------------------------------------------------------------*/
#footer-wrapper {
overflow:hidden;
width:980px;
background:#1A1E27;
border:1px solid #10151C;
clear:both;
}
.footer .widget {
width:221px;
float:left;
padding:20px 0 0 20px;
font-size:13px;
}
.footer .widget-content {
padding:10px 0 0;
}
#footer li {
list-style:none;
line-height:1.8em;
}
#credits {
border:1px solid #10151C;
clear:both;
width:980px;
height:25px;
font-size:10px;
color:#97a3a9;
background:#0c0f12;
}
#credits_left {
float:left;
padding-left:20px;
}
#credits_right {
float:right;
padding-right:20px;
}
#credits a {
color:#539DE8;
text-decoration:none;
font-size:10px;
outline:none;
}
]]></b:skin>
<b:if cond='data:blog.pageType != "item"'>
<style>
/*homepage styles
-----------------------------------------------------------------------------------*/
#main-wrapper {
float:left;
margin:0;
background:none;
overflow:hidden;
border:0;
width:538px;
}
.post {
background:url(http://i474.photobucket.com/albums/rr109/coolwebbies/Premium/postbg.jpg);
background-repeat:no-repeat;
width:250px;
height:247px;
margin:0;
padding:10px 0 0 18px;
border:0;
display:inline;
float:left;
overflow:hidden;
position:relative;
}
.post h3 {
padding-bottom:8px;
font-family:arial;
font-size:10px;
font-weight:normal;
bottom:15px;
color:#5b6065;
text-transform:uppercase;
margin:0;
position:absolute;
}
.post-body {
overflow:hidden;
width:213px;
height:168px;
padding:0;
margin:21px 0 0;
}
.post img {
height:168px;
width:213px;
}
</style>
</b:if>
</head>
<body>
<div id='outer-wrapper'>
<!-- 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>
<div id='header-wrapper'>
<div id='head-inner'>
<b:section class='header' id='header' maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true' title='Douglas Assis (Cabeçalho)' type='Header'/>
</b:section>
</div>
<div id='r_head'>
<b:section class='header' id='header2' preferred='yes'/>
</div>
</div>
<div class='menu'>
<li><a class='home' expr:href='data:blog.homepageUrl'>
Home</a></li>
</div>
<div id='content-wrapper'>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
</div>
<div id='sidebar-wrapper'>
<div id='sidebar-left'>
<b:section class='sidebar' id='sidebarl' preferred='yes'>
<b:widget id='Feed1' locked='false' title='BloggerThemes' type='Feed'/>
</b:section>
</div>
<div id='sidebar-right'>
<b:section class='sidebar' id='sidebarr' preferred='yes'>
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
</b:section>
</div>
<div id='sidebar-bottom'>
<b:section class='sidebar' id='sidebarb' preferred='yes'/>
</div>
</div>
<!-- spacer for skins that want sidebar and main to be the same height-->
<div class='clear'> </div>
</div> <!-- end content-wrapper -->
<div id='footer-wrapper'>
<b:section class='footer' id='footer' showaddelement='yes'>
<b:widget id='Profile1' locked='false' title='Quem sou eu' type='Profile'/>
</b:section>
</div>
<!--
MyShowcase blogger theme comes under a Creative Commons license.
They are free of charge to use as a theme for your blog and
you can make changes to the templates to suit your needs.
and please you must keep the footer credit links intact which
provides credit to its authors.
-->
<div id='credits'>
<div id='credits_left'>
Copyright 2009 <a expr:href='data:blog.homepageUrl'><data:blog.title/></a>
</div>
<div id='credits_right'>
Design by <a href='http://www.BloggerThemes.net' title='Bloggerthemes'>BloggerThemes</a>
</div>
</div>
</div> <!-- end outer-wrapper -->
</body>
</html>
