Trouble code Tabs? - html

Question

I got a new Member ....
I have a problem with the Web programming that cannot be resolved.
The problem code that I hastt anything Tabs just do not ...
http://8pic.ir/images/mrghe6ey1a8wkbxjefzw.png
Now my own Tabs. And the HTML code and Style and I entered the picture. But I do want to Mote ...
Now what do I enter HTML code and Style that looks like above it:
This bug check codes from?
These codes are related to Tabs.
http://Trainbit.com/files/1222191884/Tabs_Style_amp_HTML.txt
HTML:
<div class="list-wrap">
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider">
Permalink to Post With Featured
<br/>
2014 17 June
</div>
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider">
Permalink to Post With Featured
<br/>
2014 17 June
</div>
</div>
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider">
Permalink to Post With Featured
<br/>
2014 17 June
</div>
</div>
</div>
CSS:
.img-box{
width:89px;
height:89px;
margin:10px 10px;
float:left;
padding-left:-5px;
}
.img-box img{
width:89px;
height:89px;
float:left;
}
.text-slider{
margin:10px;
font-size:11px;
float:right;
}
.post-list a{
text-decoration:none;
font-size:13px;
color:#7b7c7c;
float:right;
}
.text-slider a:hover{
color:#54d5d5;
}
Thank you I will submit an answer:)

Answer 1

I think I got your problem fixed. You have to specify a width and height for your <div>s to work the way you want them to. See this: http://jsfiddle.net/P6gkx/
HTML:
<div class="list-wrap">
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider"> Permalink to Post With Featured
<br/>2014 17 June</div>
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider"> Permalink to Post With Featured
<br/>2014 17 June</div>
</div>
</div>
<div class="post-list">
<div class="img-box">
<img src="/<?php bloginfo('template_url'); ?>/image/1.png" />
</div>
<div class="text-slider"> Permalink to Post With Featured
<br/>2014 17 June</div>
</div>
</div>
CSS:
.img-box {
width:89px;
height:89px;
margin:10px 10px;
float:left;
padding-left:-5px;
}
.img-box img {
width:89px;
height:89px;
float:left;
}
.text-slider {
margin:10px;
font-size:11px;
float:left;
}
.post-list a {
text-decoration:none;
font-size:13px;
color:#7b7c7c;
float:left;
}
.text-slider a:hover {
color:#54d5d5;
}
.post-list{
width:310px;
display:block;
height:120px;
background-color:#ddd;
margin-bottom:5px;
}