Back to top

Autore Topic: [RISOLTO] Separare articoli con linee  (Letto 4132 volte)

Offline JMrBrown

  • Nuovo arrivato
  • *
  • Post: 6
    • Mostra profilo
[RISOLTO] Separare articoli con linee
« il: 17 Ott 2011, 14:46:22 »
Ciao a tutti.
Il mio problema è che, per la mia scarsa esperienza con i fogli css, non riesco ad inserire linee orizzontali per separare gli articoli mostrati in homepage. Ho fatto varie ricerche su internet (e su questo stesso forum) ma proprio non riesco a sistemare la cosa!


Questo è il mio foglio CSS (un bel casino, lo so):
Codice: [Seleziona]
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,font,img,ins,kbd,q,s,samp,small,strike,sub,sup,tt,var,center,dl,dt,dd,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td {background: transparent;border: 0;font-style: inherit;font-weight: inherit;margin: 0;padding: 0;outline: 0;vertical-align: baseline;} table {border-collapse: collapse;border-spacing: 0;}


/* Main Layout */
html {height: 100%;}
body { font:normal 13px/1.5em Arial, Helvetica, Sans-Serif; color:#fff; }
body.contentpane { background:#2853a2;}
body {
   background: #2853a2 url(../images/bg.jpg) 0 0 fixed;
   background-repeat: no-repeat;
   background-position: top Center;
   
}


h1,h2,h3,h4,h5,h6 {margin:0; padding:10px 0; font-weight:bold; color:#1689ff;font-family:Arial, Helvetica, sans-serif;}
.componentheading { font-style:italic;font-size:25px; margin:0; padding:0 0 10px 0; color:#1a528c;}
h1 { font-size: 20px;}
h2 { font-size: 18px;}
h3 { font-size: 16px;}
h4 { font-size: 14px;}
a:link, a:visited { text-decoration: none; color: #9cdaff;}
a:hover { text-decoration: underline; color: #2f7ac0;}
ul {margin:0 0 0 15px;}
p {margin-top: 0;margin-bottom: 10px; padding: 0 5px 0 5px;}
blockquote { background:#eee; border:3px solid #ccc; margin:5px; padding:5px; font-size:18px; font-family:Arial, Helvetica, sans-serif; font-style:italic}
element.style { height:auto;}
hr { width:100%; clear:both; border:none; height:2px; background:#eee; margin:0; padding:0;}
.clr {clear: both;}
.highlightit img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.5;
}


.highlightit:hover img{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;
}


/* Header */
#header { position:relative; height:89px; width:960px; margin:0 auto;}
#header-w {position:relative;}
.top {color:#fff;width:450px;overflow:hidden; padding:20px 0 0 0; margin:0 0 0 500px;z-index:1;}
.top a {color:#fff; text-decoration:underline}
.logo { position:absolute; top:13px; left:13px; color:#fff;}
.tguser { position:absolute; right:10px; top: 10px; color:#fff;}
#slide-w { margin:0; padding:0; background:#EAEAEA url(../images/bg.png) 0 0 repeat-x; border-bottom:1px solid #d6d6d6;border-top:1px solid #f5f5f5;}
#slide { width:960px; margin:0 auto;}
/* Navigation */
#nav {}
#navl {}
#navr {background: none;height:47px; background:url(../images/mainmenu.png) 0 0 repeat-x; font-family: segoe ui, verdana, arial, sans-serif; -moz-border-radius: 5px; border-radius: 5px;}
#nav {z-index:10; position:relative;}
#nav-left { float:left; width:90%;}
#nav-right { float:right; width:80px; padding-right:8px; padding-top: 10px;}
#nav ul {margin:0; padding:0; float:left;}
#nav ul li {list-style:none;float:left;height:100%;position:relative; padding:0; margin:0; border-right: 1px dotted #333333;}
#nav ul li a { display:block;padding:0 15px 0 15px; margin:0; line-height:47px; color:#FFF; text-decoration:none;font-size:14px;font-weight:normal;text-shadow: 1px 1px #000000;-moz-border-radius: 5px;border-radius:5px}
#nav ul li.active {}
#nav ul li.active a {background:url(../images/mainmenu-h.png) 0 0 repeat-x}
#nav ul li:hover {}
#nav ul li a:hover{ text-decoration:none; font-weight:normal; color: #9bd4f5;font-size:14px; background:url(../images/mainmenu-h.png) 0 0 repeat-x;-moz-border-radius: 5px;border-radius:5px}
#nav ul li ul {position:absolute;width:180px;left:-999em;border-top:0; margin:0; padding:0;}
#nav ul li:hover ul, #menu ul li.sfHover ul {left:0;}
#nav ul li ul li {padding:0;height:auto;width:180px; margin:0; border:none;}
#nav ul li:hover ul li a {text-shadow:none;}
#nav ul li:hover ul li { background:none;}
#nav ul li:hover ul li a, #nav ul li ul li a, #nav ul li.active ul li a{margin:0; padding:0 0 0 10px;height:24px;line-height:24px; background:#555;border-bottom:1px solid #3a3a3a;color:#d1d1d1; font-size:11px;font-weight:normal;text-shadow:none;-moz-border-radius:0;}
#nav ul li ul li a:hover, #nav ul li ul li.active a, #nav ul li.active ul li a:hover, #nav ul li.active ul li.active a {margin:0; padding:0 0 0 10px;height:24px;line-height:24px;background:#343434;color:#fff; font-size:11px;text-shadow:none;-moz-border-radius:0;}
#nav ul li ul ul, #nav ul li:hover ul ul, #nav ul li:hover ul ul ul, #nav ul li:hover ul ul ul ul, #nav ul li.sfHover ul ul, #nav ul li.sfHover ul ul ul, #nav ul li.sfHover ul ul ul ul {left:-999em;}
.article_separator {border-top: 1px solid #e0e0e0; display: block; width: 95%;}


/* Sidebar */
#leftbar-w {padding:0px;width:209px;float:left;}
#addthis {float:center; padding-left: 12px; padding-top: 5px;}
#rightbar-w {margin-right:12px;padding:0px;width:209px;float:right;}
#sidebar {padding:0}
#sidebar .module {padding:6px 0 6px 0; margin:0;}
#sidebar .module-title {font-size:16px;font-weight:100;margin:0;height:24px; line-height:24px; color: #fff; padding:0 0 0 22px; font-family:Tahoma, sans-serif;}
#leftbar-w .module-title {padding: 0 0 0 15px; background: #183e66 repeat-x center top; }
#rightbar-w  .module-title {padding: 0 0 0 15px; background: #183e66 repeat-x center top;}
#sidebar .module-body {margin:0; padding:13px; border:1px solid #d2d1d1; background:#3065c7; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; color:#fff;}
#sidebar .module-body p{padding:0; margin:0;}
#sidebar  ul li { margin:0 5px; padding:0;}
#sidebar .module ul.menu{margin:5px 0 0 0; padding:0;list-style:none; padding:0; list-style-type:none;}
#sidebar .module ul.menu li{ list-style:none; list-style-type:none;margin:0; padding:0; border-bottom:1px dotted #00fffc;}
#sidebar .module ul.menu li a {display:block;margin:0; padding:3px 0 3px 15px;font-weight:bold;line-height:20px;background: url(../images/dark.gif) 0% 50% no-repeat; text-decoration:none; font-size:13px;}
#sidebar .module ul.menu li a:hover { color:#00fffc; text-decoration:underline;}
#sidebar .module ul.menu li.active a{color:#fff;}
#sidebar .module ul.menu li ul {border-top:1px solid #e4e4e4; margin:0;}
#sidebar .module ul.menu li ul li {background:none; border:none; margin: 0 0 0 15px;   }
#sidebar .module ul.menu li ul li a{ border: 0; color:#999; background: url(../images/arrow2.png) 0% 50% no-repeat;}
#sidebar .module ul.menu li ul li a:hover{ border: 0; color:#00fffc; background: url(../images/arrow2.png) 0% 50% no-repeat; }
#sidebar .module ul.menu li.active ul li a{color: #6e99c2;}
#sidebar .module ul.menu li ul li.active a, #sidebar .module ul.menu li.active ul li a:hover{color:#fff;}


/* Content */
#main { margin:0px auto 0 auto;position: relative;}
#main-content { clear:both;margin-top: 20px; background:#2853a2; position:relative; height:100%;border: 1px solid #bab9b9;color: #fff; -moz-border-radius: 5px 5px 0 0;border-top-right-radius: 5px;  border-top-left-radius: 5px;}


#maincol {position: relative;}
#wrapper { margin:0 auto; width:960px; padding:0;position: relative;}
#hdd {text-indent:-9999em;}
.top1 {background:url(../images/main-top.png) 0 0 no-repeat;clear:both;}
.top2 {background: url(../images/main-top.png) 100% 100% no-repeat; }
.top3 { background: #2853a2; height: 6px;margin:0 6px;}
.bot1 {background:url(../images/main-bot.png) 0 0 no-repeat;clear:both;}
.bot2 {background: url(../images/main-bot.png) 100% 100% no-repeat;}
.bot3 { background: #2853a2; height: 6px;margin:0 6px;}


#leftcolumn{margin-left:9px;padding:0px;width:205px;float:left;}
#rightcolumn{margin-right:9px;padding:0px;width:205px;float:right;}
#centercontent{width:500px;float:left;margin:0px 5px 0px 5px;padding:0px;overflow:hidden;}
#centercontent_md{width: 725px;float:left;margin:0px 5px 0px 5px;padding:0px;overflow:hidden;}
#centercontent_bg{width: 950px;float:left;margin:0px 5px 0px 5px;padding:0px;overflow:hidden;}


div.clearpad {float:left;padding:0 0px 15px 10px;}
div.clearpad ul {clear: both;}


.article_separator {border-top: 1px solid #e0e0e0; display: block; width: 95%;}


/* Content styles */
ul.archive li { list-style:none; padding:0 0 0 10px;}
.archive .article-count {color:#999;}
.blog-featured {background:#2853a2; color: #fff; border:1px solid #e5e5e5; -moz-border-radius: 8px 8px 8px 8px; border-radius:8px;}
.items-leading {position: relative; clear:both; padding: 3px 0px 3px 4px; margin-top:2px;}
.items-row {position: relative;clear:both;}
.item-page { position:relative; background:#2853a2; color: #fff; border:1px solid #e5e5e5; padding: 10px; -moz-border-radius: 8px 8px 8px 8px; border-radius:8px;}
h2.item-page-title {padding: 3px 0px 3px 4px; margin-bottom: 1px;}
h2.item-page-title a{color:#69f3ff; font-size: 20px;font-weight:bold; text-shadow: black -0.1em 0.1em 0.2em}
.item-page-title, .item-page-title a {text-decoration:none; color:#01406a;}
.item-page-title a:hover {}
.buttonheading { position:absolute; top:5px; right:0; padding:10px;}
.buttonheading .edit {float:right;margin:0 5px;}
.buttonheading .print { float:right; margin:0 5px;}
.buttonheading .email {float:right;margin:0 5px;}
.iteminfo {font-size: 12px;overflow:hidden;margin-bottom:5px;display:block;width: 100%; color:#999; padding-left: 5px; line-height: 13px;}
.iteminfo a {color:#999;} .iteminfo a:hover {color:#333;}
.iteminfo .category {}
.iteminfo .sub-category { padding:0 0 0 0px}
.iteminfo .create {}
.iteminfo .modified {}
.iteminfo .published {}
.iteminfo .createdby {font-weight:bold; display:block}
.items-more {clear:both; padding:10px;} h3.items-more { font-size:14px; padding:0; margin:0;}
.items-more ol { margin:0 0 0 30px; padding:0}
th.list-title, th.list-author,th.list-hits,th.list-date  { background:#3F332E url(../images/h3.png) 0 0 repeat-x; padding:2px; border-right:1px solid #fff; color:#fff;}
th.list-title a, th.list-author a,th.list-hits a,th.list-date a { color:#fff; font-weight:bold}
td.list-title, td.list-author, td.list-hits, td.list-date { border-bottom:1px dotted #ccc;}
td.list-title { width:50%;}
td.list-author { width:15%; text-align:center;}
td.list-hits { width:5%;text-align:center;}
td.list-date { width:15%;text-align:center;}
.cols-1 {width:100%; clear:both;}
.cols-2 .column-1{width:45%;float:left; margin:4px;}
.cols-2 .column-2{width:45%;float:right; margin:4px;}
.cols-3 .column-1{width:32%;float:left}
.cols-3 .column-2{width:32%;margin-left:1%;float:left;}
.cols-3 .column-3{width:32%;float:right;}
.cols-4 .column-1{width:23%;float:left}
.cols-4 .column-2{width:23%;margin-left:1%;float:left;}
.cols-4 .column-3{width:23%;margin-left:1%;float:left}
.cols-4 .column-4{width:23%;margin-left:0;float:right}
.column-1, .column-2, .column-3, .column-4 { position:relative;margin:0 0 20px 0}
.article_separator {border-top: 1px solid #e0e0e0; display: block; width: 95%;}




/* Contact styles */
th.item-num, th.item-title,th.item-position,th.item-phone,th.item-suburb,th.item-state { background:#3F332E url(../images/h3.png) 0 0 repeat-x; padding:2px; border-right:1px solid #fff; color:#fff;}
th.item-num a, th.item-title a,th.item-position a,th.item-phone a,th.item-suburb a,th.item-state a {color:#fff}
td.item-num {width:5%; text-align:center;}
td.item-title {width:25%; text-align:center;}
td.item-position {width:15%;text-align:center;}
td.item-phone {width:15%;text-align:center;}
td.item-suburb {width:15%;text-align:center;}
td.item-state {width:15%;text-align:center;}
.contact label { width:100px;font-weight:bold; float:left}
.contact input { float:left;}
.contact .jicons-icons { float:left; padding:5px 10px 10px 0;}
.contact h3 { font-size:14px;}


.spacer .module {float: left;}
.spacer.w99 .module {width: 100%;}
.spacer.w49 .module {width: 50%;}
.spacer.w33 .module {width: 33.3%;}
.spacer.w24 .module {width: 24.5%;}


.readmore { margin:0; line-height:20px; font-variant:small-caps; -moz-border-radius: 8px 8px 8px 8px; border-radius:8px; background: none repeat scroll 0 0;}


ul.pagenav { display:block;} ul.pagenav li { list-style:none;}
.pagenav-prev { float:left; padding-top: 10px;}
.pagenav-next { float:right; padding-top: 10px;}
.pagination { clear:both;}
span.pagination { background:none;}
.pagination span, .pagination a, ul.pagenav li a {padding: 1px 8px; background: #2853a2; color: #fff; font-weight: bold; font-size: 90%;}
.pagination a, ul.pagenav li a {  font-weight: bold; text-decoration:underline}
.button, .validate { padding: 1px 8px; border: 1px solid #999999; background: #b9b8b8; color: #FFF; font-weight: bold; font-size: 90%;}
.button:hover,.validate:hover,.pagination a:hover,ul.pagenav li a:hover  {background:#757474;color:#fff;}
.inputbox, input, textarea, select {background:#13618d repeat scroll 0 0 transparent ; border:1px solid #c0c0c0; color:#4c4c4c; -moz-border-radius: 5px; border-radius: 5px;}
.breadcrumbs { padding:0 0 0 10px; color:#fff;}
.searchbox {background: url(../images/search.png) no-repeat ; margin-top: 7px; width: 165px; height: 18px; color:#13618d; -moz-border-radius: 5px; border-radius: 5px;}


/* Modules 1 */
#mods1 {overflow: hidden;padding:0; margin:0 auto;clear:both;}
#mods1 .module { padding:0; margin:0; }
#mods1 .inner { padding:10px; }
#mods1 .module-title {margin:0;padding:0 0 10px 0;}
#mods1  h3 {display: block;padding-left: 10px;padding-top: 3px;height: 20px;font-size: 18px;}
#mods1 .module-body {padding:0; margin:0;}
#mods1 ul {margin:0 10px; padding:0;}
#mods1 ul li {list-style:inside;}
#mods1-i { clear:both;}
/* Modules 2 */
#mods2 {overflow: hidden;padding:0; margin:0 auto;clear:both;width:960px; }
#mods2 .module { margin:0;padding:0;}
#mods2 .inner { padding:10px;}
#mods2 .module-title {margin:5px 0;padding:0;display: block;height: 22px;font-size: 20px;font-weight:100; color:#333; text-shadow:1px 1px #fff;}
#mods2 .module-body {padding:0; margin:0;}
#mods2 a {color:#419af8;}#mods2 a:hover {}
#mods2 ul {margin:0; padding:0;}
#mods2 ul li {list-style:inside;margin:0; padding:0;}
/* Modules 3 */
#mods3 {overflow: hidden;padding:0; margin:0 auto; clear:both; width:960px; color:#dfdfdf; background:#1a528c url(../images/mods3.png) 0 0 repeat-x;}
#mods3 .module { margin:0;padding:0;}
#mods3 .inner { padding:5px 10px 0 10px;}
#mods3 .module-title {margin:0 0 5px 0;padding:0;display: block;height: 22px;font-size: 20px;font-weight:normal; color:#fff; text-shadow:1px 1px #000;}
#mods3 .module-body {padding:0; margin:0;}
#mods3 a { color:#419af8;}#mods3 a:hover { color:#fff;}
#mods3 ul {margin:0; padding:0;}
#mods3 ul li {list-style:inside; border-bottom:1px dotted #043466; list-style:none;}
#mods3 ul li:hover {}
#mods3 ul li a {font-weight:100; display:block; padding:0 0 0 15px; background:url(../images/arrow.png) 0 50% no-repeat;}
.article_separator {border-top: 1px solid #e0e0e0; display: block; width: 95%;}


/* Footer */
#footer .top1 {background:url(../images/mods3-top.png) 0 0 no-repeat;clear:both;}
#footer .top2 {background: url(../images/mods3-top.png) 100% 100% no-repeat; }
#footer .top3 { background: #1d6595; height: 6px;margin:0 6px;}
#footer .bot1 {background:url(../images/mods3-bot.png) 0 0 no-repeat;clear:both;}
#footer .bot2 {background: url(../images/mods3-bot.png) 100% 100% no-repeat; }
#footer .bot3 { background: #1d6595; height: 6px;margin:0 6px;}
#footer { clear:both; margin:10px 0 0 0; padding:0;}
.footer-pad { width:960px; margin:0 auto; padding: 0;}
#bottom {width:960px; margin:0 auto; padding:5px 0 0 0; background: #1345d7 ; -moz-border-radius-bottomright: 7px; -moz-border-radius-bottomleft: 7px; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px;}
.copy { margin:0; padding:0 0 0 10px;font-size:12px; float:left;color:#ccc}
.copy a {font-size:12px; color:#ccc}
.design {margin:0; text-align:center; float:center; color:#e5e3e3; font-size:9px;padding: 0;width: 290px; margin: 0 auto;}
.design a { text-decoration:none; font-size:9px;color:#e5e3e3; font-weight:bold;padding: 0;}


/* System Messages */
#system-message    { margin: 0; padding: 0;}
#system-message dt { font-weight: bold; }
#system-message dd { margin: 0; font-weight: bold; text-indent: 30px; }
#system-message dd ul { color: #0055BB; margin: 0; list-style: none; padding: 10px; border-top: 3px solid #84A7DB; border-bottom: 3px solid #84A7DB;}
/* System Standard Messages */
#system-message dt.message { display: none; }
#system-message dd.message {  }
/* System Error Messages */
#system-message dt.error { display: none; }
#system-message dd.error ul { color: #c00; background-color: #E6C0C0; border-top: 3px solid #DE7A7B; border-bottom: 3px solid #DE7A7B;}
/* System Notice Messages */
#system-message dt.notice { display: none; }
#system-message dd.notice ul { color: #c00; background: #EFE7B8; border-top: 3px solid #F0DC7E; border-bottom: 3px solid #F0DC7E;}
/* Debug */
#system-debug     { color: #ccc; background-color: #fff; padding: 10px; margin: 10px; }
#system-debug div { font-size: 11px;}
#error { width:600px; margin:100px auto 0 auto; padding:20px; background:#fff;-moz-border-radius:6px;border-radius:6px;}
#error  .error { color:#FF0000}


.tg  a{color: #676666;}
.tg {-moz-border-radius: 7px 7px 7px 7px; border-radius:7px; background: none repeat scroll 0 0 #5b5b5b;clear: both;color: #676666;font-size: 11px;padding: 5px;position: relative;}
#topimage {background: url(../images/screen.jpg); height: 152px; color:#fff; float: left; width: 958px; margin-top:5px; margin-bottom: 5px;-moz-border-radius: 5px; border-radius:5px; border: 1px solid #bab9b9;}
#topimage-nf {width: 450px; float:right; height: 102px; padding: 10px; overflow:hidden;margin-right: 10px;}


#user-bottom { background: fff ; width: 960px; margin:0 auto; padding: 0; text-align: left; height: 100%;}
.user1 { color: #fff; padding: 10px 0px 0px 10px; float: left; width: 465px; background: #fff;}
.user1  h3, .user2  h3 {color:#fff;}
.user2 { color: #fff; padding: 10px 10px 0px 10px; float: right; width: 465px; background: #fff;}


Ed il mio sito è questo: http://www.quiradiolonda.it/


Come posso fare?


Grazie in anticipo,
Daniele
« Ultima modifica: 17 Ott 2011, 19:00:23 da JMrBrown »

Offline conti1

  • Global Moderator
  • Instancabile
  • ********
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Separare articoli con linee
« Risposta #1 il: 17 Ott 2011, 18:28:40 »
ciao
probabilmente il template non ah il css x il separatore articoli.

inserisci questo css nel tuo template
Codice: [Seleziona]
.item-separator {   
background: red;   
height: 2px;   
width: auto;   
margin-right: 26px;   
margin-left: 26px;   
margin-top: 10px;   
margin-bottom: 10px;}

lo puoi modificare a tuo piacere questo e solo un esempio x farti capirte. mettilo nel  file styles.css
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline JMrBrown

  • Nuovo arrivato
  • *
  • Post: 6
    • Mostra profilo
Re:Separare articoli con linee
« Risposta #2 il: 17 Ott 2011, 18:34:01 »
Ciao! Grazie mille per la risposta.
Ho provato ad inserire il codice nel foglio styles.css, ma non è cambiato nulla!
Quale può essere il motivo?

Offline conti1

  • Global Moderator
  • Instancabile
  • ********
  • Post: 9075
  • Sesso: Maschio
    • Mostra profilo
Re:Separare articoli con linee
« Risposta #3 il: 17 Ott 2011, 18:46:41 »
come non è successo nulla io vedo una riga bianca.
ricarica la pagina   e svuta anche la cache .
se possibile postare il link  x risolvere al meglio il problema grazie
evitare nomi commerciali grazie

Offline JMrBrown

  • Nuovo arrivato
  • *
  • Post: 6
    • Mostra profilo
Re:Separare articoli con linee
« Risposta #4 il: 17 Ott 2011, 18:59:50 »
Hai ragione!
Grandioso!
Grazie ancora

Offline Tirchenko

  • Nuovo arrivato
  • *
  • Post: 4
  • Sesso: Maschio
    • Mostra profilo
Re:[RISOLTO] Separare articoli con linee
« Risposta #5 il: 07 Nov 2011, 13:38:13 »
Ciao, scusatemi, vorrei anch'io usare i separatori di articoli ma non ce la faccio...
Il template che uso io ha solo il file layout.css. Inserisco il codice in fondo al file ma non mi fa nulla...
Devo aggiungere qualche altra cosa da qualche altra parte?

Grazie :D

Offline Tirchenko

  • Nuovo arrivato
  • *
  • Post: 4
  • Sesso: Maschio
    • Mostra profilo
Re:[RISOLTO] Separare articoli con linee
« Risposta #6 il: 07 Nov 2011, 13:54:14 »
Niente risolto... Ci ha messo un pò a farmi vedere le righe nonostante abbia cancellato la cache. Misteri dell'informatica.


Grazie  ;D

 



Web Design Bolzano Kreatif