Ho provato a posizionarlo dentro il contenuto, impostando un margin negativo per farlo risalire accanto al contenuto, ma il problema rimane poi il footer, staccato dal box
Ecco l'html
codice:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta name="description" content="" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="menu">
<ul>[*]home[*]programmi tv[*]chi sono[/list]
<div id="search">
ricerca </div>
<div id="rss">RSS</div>
</div>
<div id="wrap">
<div id="header">
<div id="logo">
</div>
</div>
<div id="contenuto">
<div id="dx">
<div class="box"><span>Post recenti</span>
<ul>
[*]http://SEO ed i segreti del robots.t...o corretto uso
[*]SEO ed i segreti del robots.txt – guida al suo corretto uso
[*]SEO ed i segreti del robots.txt – guida al suo corretto uso
[*]SEO ed i segreti del robots.txt – guida al suo corretto uso
[*]SEO ed i segreti del robots.txt – guida al suo corretto uso[/list]
</div>
<div class="box">
<span>Categorie</span>
<ul>
[*]categoria
[*]categoria
[*]categoria
[*]categoria
[*]categoria
[/list]
</div>
</div>
<div id="sx">
<div class="post">
<div class="data"></div>
<div class="titolo">SEO ed i segreti del robots.txt – guida al suo corretto uso</div>
<span class="subtit">scritto da Blays in Guide e How To </span>
<div class="testo_post">
In questo articolo inserirò, in ordine sparso e con successivi aggiornamenti, dei piccoli consigli su come utilizzare al meglio il file robots.txt, al fine di indicizzare correttamente un sito web.
Se una richiesta specifica verrÃ_ fatta attraverso un commento, la risposta verrÃ_ inserita come risorsa aggiuntiva all’interno dell’articolo.</div>
</p>
</div>
<br style="clear:both" />
</div>
<div id="twitter">
<span class="img_tw"></span>
<span class="title_tw"><span>BLAYS</span> on twitter</span>
<ul>[*]A Link Development Strategy for Large Websites http://t.co/gaxuWHzc are links to category good? circa 2 ore fa da Twitter for Android[*]#buongiorno a tutti voi! @mareikagiacobbi @AnnaAnika @chiarastorti @valijolie @vnotarfrancesco @Samyorn 08:37:46 AM marzo 05, 2012 da TweetDeck[*]#buongiorno a tutti voi! @mareikagiacobbi @AnnaAnika @chiarastorti @valijolie @vnotarfrancesco @Samyorn 08:37:46 AM marzo 05, 2012 da TweetDeck[/list]
</div>
<br style="clear:both" />
</div>
<br style="clear:both" />
</div>
<div id="footer">
<div>
Blays' World · Powered by WordPress
</div></div>
</body>
</html>
CSS
codice:
body {margin:0; background-image:url(images/bg.gif); font-family:Trebuchet MS, arial, sans-serif; }
#menu { background-image:url(images/bg-menu.gif); height:42px;}
#menu ul {padding:0px; margin:0;width:1152px; margin-left:auto; margin-right:auto; list-style-type:none;}
#menu ul li {float:left; padding:7px 60px 0px 0px;}
#menu ul li a {display:block; font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:20px; color:#fff; text-decoration:none;}
#wrap {width:1152px; margin-left:auto; margin-right:auto; background:url(images/bg-light.gif) no-repeat center top; height:100%; margin-bottom:-44px;}
#header {height:140px; padding-top:10px;}
#logo {background:url(images/logo.png) no-repeat; width:399px; height:135px;}
#footer {clear:right; height:60px;background-color:#195274;}
#footer div {font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:18px; padding-top:10px;color:#fff;width:1152px; margin-right:auto; margin-left:auto; height:50px; }
@font-face {
font-family: 'BebasRegular';
src: url('BEBAS___-webfont.eot');
src: url('BEBAS___-webfont.eot?#iefix') format('embedded-opentype'),
url('BEBAS___-webfont.woff') format('woff'),
url('BEBAS___-webfont.ttf') format('truetype'),
url('BEBAS___-webfont.svg#BebasRegular') format('svg');
font-weight: normal;
font-style: normal;
}
#search {font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:20px; color:#fff; padding-top:7px; float:left; margin-left:100px; width:300px;}
#menu #rss {width:115px; height:60px; background-image:url(images/rss.png); float:left; margin-left:200px; margin-top:20px;}
#menu #rss a {width:115px; height:60px; text-indent:-9999px; display:block;}
#twitter {width:365px; height:250px; background-color:#195274; margin-top:50px; border-top-left-radius: 20px;border-top-right-radius: 20px; margin-right:30px; }
#twitter .img_tw {background-image:url(images/twitter.png); width:82px; height:88px; display:block; margin-top:-38px; margin-left:15px; float:left;}
#twitter .title_tw {font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:18px; color:#fff; float:left; text-shadow: #000 1px 2px 1px;}
#twitter .title_tw span {font-size:36px;}
#twitter ul {clear:left; color:#fff; font-size:12px; list-style-type:none; padding-left:15px;}
#twitter ul li {margin-bottom:4px;}
#contenuto {margin-top:30px; height:100%;}
#sx {width:722px; background-color:#deeff8; border-top-left-radius: 20px;border-top-right-radius: 20px; margin-right:200px; height:100%; }
#dx {float:right; width:390px; }
#dx .box {float:left; width:190px; }
#dx .box span {font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:18px; color:#195274;}
#dx .box ul {padding-left:0px; margin-left:0px; list-style-type:none; font-size:14px; color:#195274;}
#dx .box ul li{margin-bottom:12px; background:url(images/arrow.gif) no-repeat 0px 3px; padding-left:14px;}
#dx .box ul li a{color:#195274; text-decoration:none;}
#dx .box ul li a:hover {color:#195274; text-decoration:underline;}
.post { padding:15px;}
.post .titolo {font-family:'BebasRegular', Trebuchet MS, sans-serif; font-size:24px; color:#407fa5; text-shadow: #fff 1px 2px 1px;}
.post .subtit {color:#407fa5; font-size:14px;}
.post .subtit a {color:#407fa5; }
.testo_post {color:#323232; font-size:15px; }
.testo_post p {text-align:justify; }
Rispondi quotando
