Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <div style="clear:both"></div>
- #section{
- width: 560px;
- float: left;
- font-size: 0.8em;
- position: relative;
- }
- .dl .dd h4{
- font-size: 0.9em;
- }
- .dl h4 a{
- text-decoration: none;
- font-weight: normal;
- }
- .dl h4 a:hover{
- text-decoration: underline;
- }
- .dl .dt{
- float: left;
- width: 100px;
- height: 75px;
- font-size: 0.5em;
- margin: 0 0 5px 0;
- }
- .dl .dd{
- width: 480px;
- float: right;
- }
- .dl .wrapper { /* new element added */
- overflow: hidden;
- height: 100%;
- padding: 10px 0 5px;
- }
- .dl .dd p{
- font-size: 0.7em;
- font-style: italic;
- }
- /* No need of this code
- .dl:after,
- .dl .dt:after,
- .dd:after,
- .dl .dt img:after
- {
- content:"";
- height: 0;
- clear: both;
- display: block;
- }
- */
- <div class="dl">
- <div class="wrapper">
- <div class="dt"><img src="/news_pics/16.jpg" alt="pic 1" width="100px" height="75px"/> </div>
- <div class="dd"><p>12 06 2012</p><h4><a href="#">News 1 title khfk ds khf kdsfkdsh fkkds hfkhdsjkf kj kjs hdfkjdsk kds k hfkjhds k ks hdfkjhds fjk hdsk hfkjds kgjkl f dflgk dflkdf lk lf jdl glklk dllgdldl l dfljlgkjdflgkjdf</a></h4></div>
- </div>
- <div class="wrapper">
- <div class="dt"><img src="/news_pics/16.jpg" alt="pic 2" width="100px" height="75px"/></div>
- <div class="dd"><p>21 05 2012</p><h4><a href="#">News 2 title</a></h4></div>
- </div>
- <div class="wrapper">
- <div class="dt"><img src="/news_pics/16.jpg" alt="pic 3" width="100px" height="75px"/></div>
- <div class="dd"><p>19 05 2012</p><h4><a href="#">News 3 title title khfk ds khf kdsfkdsh fkkds hfkhdsjkf kj kjs hdfkjdsk kds k hfkjhds k ks hdfkjhds fjk hdsk hfkjds kgjkl f dflgk dflkdf lk lf jdl glklk dllgdldl l dfljlgkjdflgkjdf</a></h4></div>
- </div>
- <div class="wrapper">
- <div class="dt"><img src="/news_pics/16.jpg" alt="pic 4" width="100px" height="75px"/></div>
- <div class="dd"><p>8 05 2012</p><h4><a href="#">News 4 title</a></h4></div>
- </div>
- .dl .dd p{
- width: 210px; //changed
- font-size: 0.7em;
- font-style: italic;
- }
- <div class="fix_float">
- <dt>
- date content
- </dt>
- <dd>
- text content
- </dd>
- </div>
- enter code here
- <ul class="ul">
- <li class="li">
- <img src="/news_pics/16.jpg" class="thumb" width="100" height="75">
- <div class="text">
- <p class="date">
- 12 06 2012
- </p>
- <h4>
- <a href="" class="title">
- News 1 title khfk ds khf kdsfkdsh fkkds hfkhdsjkf kj kjs hdfkjdsk kds k hfkjhds k ks hdfkjhds fjk hdsk hfkjds kgjkl f dflgk dflkdf lk lf jdl glklk dllgdldl l dfljlgkjdflgkjdf
- </a>
- </h4>
- </div>
- </li>
- <li class="li">
- <img src="/news_pics/16.jpg" class="thumb" width="100" height="75">
- <div class="text">
- <p class="date">
- 12 06 2012
- </p>
- <h4>
- <a href="" class="title">
- News 1 title khfk ds khf kdsfkdsh fkkds hfkhdsjkf kj kjs hdfkjdsk kds k hfkjhds k ks hdfkjhds fjk hdsk hfkjds kgjkl f dflgk dflkdf lk lf jdl glklk dllgdldl l dfljlgkjdflgkjdf
- </a>
- </h4>
- </div>
- </li>
- </ul>
- .ul {
- margin: 0;
- padding: 0;
- list-style: none;
- }
- .li {
- overflow: hidden;
- margin-bottom: 5px;
- }
- .thumb {
- float: left;
- width: 100px;
- height: 75px;
- }
- .text {
- margin-left: 120px;
- }
- .title {
- font-size: 0.9em;
- text-decoration: none;
- font-weight: normal;
- }
- .title:hover {
- text-decoration: underline;
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement