我需要一些帮助来解决我基于 tumblr 的投资组合网站上的一个简单问题。
我的网站是 [www.ellekorhaliller.co.uk][1]
我想更改布局，以便我可以并排放置我的帖子。例如，我希望有一行 2 个帖子，而不是只有一列帖子，而在下面的另一行有两个帖子，依此类推。
我确信这是一个非常容易解决的问题，但如果有人能指出我需要更改的 CSS 的正确方向，我将不胜感激。
请参阅下面的代码。
艾丽。
<html>
<head>
<title>Elle Korhaliller - Fashion Stylist</title
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
<link href='http://static.tumblr.com/twte3d7/DHIm5wmgi/stylesheet.css' rel='stylesheet' type='text/css'>
<!--
.d8888b. 888b d888 8888888b. 888
d88P Y88b 8888b d8888 888 Y88b 888
Y88b. 88888b.d88888 888 888 888
"Y888b. 888Y88888P888 888 d88P 888
"Y88b. 888 Y888P 888 8888888P" 888
"888 888 Y8P 888 888 888
Y88b d88P 888 " 888 888 888
"Y8888P" 888 888 888 88888888
Disassemble 3.0 Theme for Tumblr by Georgia Harris
www.smpldesign.co.uk
-->
<!-- DEFAULT COLORS -->
<meta name="color:Background" content="#ffffff"/>
<meta name="color:Text" content="#000000"/>
<meta name="color:Video Corner Fold" content="red">
<meta name="font:Font" content="'BrownBold'">
<meta name="if:Show Captions" content="0"/>
<meta name="if:Uppercase Links" content="0">
<meta name="if:Fade On Hover" content="0">
<meta name="if:Show Tags on Index Page" content="0">
<style type="text/css">
body {
background-color:#ffffff;
font-family:'BrownBold', 'Muli', sans-serif;
color:#000000;
font-size:16px;
line-height:25px;
}
a {
padding-bottom:2px;
color:#000000;
text-decoration:none;
}
img {
border: none;
border : 0;
outline:none;
width: 500px;
height: auto;
max-width: 50%
}
a img {
outline: none;
}
iframe#tumblr_controls {
display:none;
}
#header {
position: fixed;
background-color: #ffffff;
padding-bottom:1cm;
z-index:5000;
width:100%;
top: 0px;
left:0px;
margin: 0px auto;
height: 40px;
}
#wrapper {
margin: 50px auto auto auto;
width: 1000px;
max-width: 100%
height: auto;
}
#post {
padding:20px 0 0 0;
width:100% !important;
position:relative !important;
font-size:14px;
}
#post img {
width: 50%;
height: auto;
}
#post img:hover {
}
#post embed, #post iframe {
width:100% !important;
}
#post .photoset a:first-child {
}
#post .photoset a {
display:none;
}
.title {
width:100%;
text-align:center;
margin:auto;
position:fixed;
top:20px;
z-index:5000;
}
.follow {
position:fixed;
top:20px;
right:20px;
z-index:5000;
}
.archive {
position:fixed;
top:20px;
left:20px;
z-index:5000;
}
.message {
position:fixed;
bottom:20px;
left:20px;
z-index:5000;
}
.random {
position:fixed;
bottom:20px;
right:20px;
z-index:5000;
}
#toTop {
width:100%;
text-align:center;
margin:auto;
z-index:5000;
position:fixed;
display:none;
bottom:20px;
cursor:pointer;
}
#page-nav {
z-index:5000; !important
position:fixed;
margin-left: auto;
margin-right: auto;
text-align:center;
text-decoration: none !important ;
padding: 30px;
}
.player {
background:#000;
width: 1000px;
max-width: 100%
height: auto;
}
ul.chat {
list-style-type:none;
width: 1000px;
max-width: 100%
height: auto;
}
#infscr-loading {
display:none !important;
}
.corner {
top:6px;
right:40px;
position:absolute;
padding:1em 1.5em;
margin:2em auto;
color:#fff;
overflow:hidden;
z-index:4000;
}
.corner:before {
content:"";
position:absolute;
top:0px;
right:0px;
border-width:0 25px 25px 0;
border-style:solid;
border-color:#fff #fff red red;
background:#fff;
display:block; width:0; /* Firefox 3.0 damage limitation */
}
.contentcolumn{
margin:auto;
width: 100%;
</style>
<script type="text/javascript" src="http://static.tumblr.com/twte3d7/4Wjm5wj58/disassemble_v3.js"></script>
<script type="text/javascript">
$(function() {
$(window).scroll(function() {
if($(this).scrollTop() != 0) {
$('#toTop').fadeIn();
} else {
$('#toTop').fadeOut();
}
});
$('#toTop').click(function() {
$('body,html').animate({scrollTop:0},800);
});
});
</script>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-36376336-1']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body>
{block:IfUppercaseLinks}<div style="text-transform:uppercase">{/block:IfUppercaseLinks}
<div id="header">
<div class="title"><a href="/"><a style="border-bottom-style: solid; border-bottom-width: 2px">{Title}</u></a></div>
<div class="archive"><a href="http://www.ellekorhalillerweb.tumblr.com/information">Information</a></div>
<div class="follow">{block:PermalinkPage}{block:Posts} {/block:Posts}{/block:PermalinkPage}<a href="http://www.ellekorhalillerweb.tumblr.com/contact">Contact</a></div></div>
<div class="message"><a href="http://www.ellekorhalillerweb.tumblr.com">Editorial</a></div>
<div class="random"><a href="http://www.ellekorhalillercommercial.tumblr.com">Commercial</a></div>
<div id="toTop">Back to top</div>
{block:IfUppercaseLinks}</div>{/block:IfUppercaseLinks}
<div id="wrapper">
<div class="contentcolumn">
{block:Posts}
<div id="post"
{block:PermalinkPage}style="width:500px"{/block:PermalinkPage}
>
{block:Text}
{block:Title}<a href="{Permalink}">{Title}</a>{/block:Title}
{Body}
{/block:Text}
{block:Link}
<a href="{URL}" class="link" {Target}>{Name}</a>
{block:Description}<div class="description">{Description}</div>{/block:Description}
{/block:Link}
{block:Quote}
<a style="border:0 !important" href="{Permalink}">"{Quote}"</a>
{block:Source}
<p>— {Source}</p>
{/block:Source}
{/block:Quote}
{block:Photo}
{block:IndexPage}<a href="{Permalink}"><div style="border:none"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" border="0"align="center"/></div></a>{/block:IndexPage}{block:PermalinkPage}{LinkOpenTag}<div style="border:none"><img src="{PhotoURL-500}" alt="{PhotoAlt}"/></div>{LinkCloseTag}{/block:PermalinkPage}
{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}
{block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
{/block:Photo}
/*Could put a center here*/
{block:Chat}
{block:Title}<h2>{Title}</h2>{/block:Title}
<ul class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label} {Line}</li>{/block:Lines}</ul>
{/block:Chat}
{block:Video}
{block:IndexPage}<a href="{Permalink}"><div class="corner"></div></a>{/block:IndexPage}
<div id="video">
{Video-500}
</div>
{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}
{block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
{/block:Video}
{block:Photoset}
{block:IndexPage}<div class="photoset">{block:Photos}<a href="{Permalink}"><img src="{PhotoURL-HighRes}" align="center"></a>{/block:Photos}</div>{/block:IndexPage}
{block:PermalinkPage}{/block:PermalinkPage}
{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}
{block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
{/block:Photoset}
{block:Audio}
{block:AlbumArt}<a href="{Permalink}"><img src="{AlbumArtURL}"></a>{/block:AlbumArt}
<div class="player">{AudioPlayerBlack}</div>
{block:IndexPage}{block:IfShowCaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:IfShowCaptions}{/block:IndexPage}
{block:PermalinkPage}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:PermalinkPage}
{/block:Audio}
{block:IfShowTagsOnIndexPage}{block:IndexPage}{block:Date}{/block:Date}{/block:IndexPage}{/block:IfShowTagsOnIndexPage}{block:PermalinkPage}{/block:Date}{/block:PermalinkPage}
</div></div>
{/block:Posts}
{block:NextPage}<div id="page-nav"><a href="{NextPage}">↓</a>{/block:NextPage}
</div>
</body>
</html>
[1]: http://www.ellekorhaliller.co.uk