XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Frage zu horizontalen Linien (http://xhtmlforum.de/showthread.php?t=59660)

marvin1989 29.12.2009 03:00

Frage zu horizontalen Linien
 
Liste der Anhänge anzeigen (Anzahl: 1)
Schönen guten Tag erstmal, da ich neu hier bin stelle ich mich auch direkt mal kurz vor.

Ich bin Marvin, 20 Jahre alt und habe weniger Ahnung von CSS als ich dachte, habe bisher immer alles ereicht was ich wollte und wenn ich noch so lange vor dem Rechner sitzen musste, aber diesmal verzweifel ich wirklich, es geht nämlich um folgenes:

[Foto im Anhang]
Die 2. Linie soll genau so sitzen wie die erste, heißt also ich müsste sie irgendwie nach rechts kriegen, aber ich habe schon gegoogelt und rumprobiert ohne Ende, ich kann partout nichts finden, ich würde mich sehr freuen wenn sich jemand die Zeit dazu nimmt und mir hilft.

Das ist die Datei des Styles Red, welches wir gerade benutzen.
Code:

@charset "utf-8";
/*** red ***/
a:link, a:visited {
        color: #DA281F;
        text-decoration:underline;
}

a:hover {
        color: #DA281F;
}

a.logo:link,a.logo:hover, a.logo:visited{
        color: #FFFFFF;
}

div#logo_bg{
        background: #ECECEC url(../images/red/bg_logo.png) top  repeat-x;
}

div#sub_banner{
        background: #000000 url(../images/red/sub_banner.jpg) top left no-repeat;
        width:1050px;
        height:20px;
        margin-left:9px;
}

#user3{
        background: #B44645 url(../images/red/bg_menu.png) top  repeat-x;
}
#pillmenu_left{
        width: 4px;
        height: 43px;
        float:left;
        background: #16171A url(../images/red/pillmenu_left.png) top left no-repeat;
}
#pillmenu_right{
        width: 4px;
        height: 43px;
        float:right;
        background: #16171A url(../images/red/pillmenu_right.png) top left no-repeat;
}
#pillmenu li a, #pillmenu li a:hover, #active_menu-nav {
        color:#FFFFFF;
        background:url(../images/red/menu_hover.png) right no-repeat;
}
#pillmenu li a:hover, #active_menu-nav {
        color:#000000;
}

#leftcolumn h3, #leftcolumn div h3, #rightcolumn h3, #rightcolumn div h3{
        background:  url(../images/red/bg_h3.png) top left no-repeat;
}

#leftcolumn div.moduletable_menu, #leftcolumn div.moduletable, #leftcolumn div.moduletable_text,
#rightcolumn div.moduletable_menu, #rightcolumn div.moduletable, #rightcolumn div.moduletable_text{
        background: url(../images/rub_bottom.png) left bottom no-repeat;
       
}
#f_area div.moduletable_menu, #f_area div.moduletable, #f_area div.moduletable_text{
        background: url(../images/rub_footer_bottom.png) left bottom no-repeat;
       
}
#f_area h3{
        background:  url(../images/red/f_area_h3.png) top left no-repeat;
}

a.readon, a.readon:hover, a.readon:visited{
        display:block;
        height:30px;
        width:109px;
        color:#FFFFFF;
        text-decoration:underline;
        padding-left: 20px;
        line-height:23px;
        background:  url(../images/red/bg_read_more.png) top left no-repeat;
        margin:10px 0px 0px 0px;
}

ul.menu li{
        list-style:none;
        background:url(../images/red/menu_arrow.png) top left no-repeat;
}
ul.mostread li{
        list-style:none;
        background:url(../images/red/menu_arrow.png) top left no-repeat;
}
ul.latestnews li{
        list-style:none;
        background:url(../images/red/menu_arrow.png) top left no-repeat;
}
.moduletable ul li {
        list-style:none;
        background:url(../images/red/menu_arrow.png) top left no-repeat;
}
div.componentheading{
        color:#DA281F;
}
#banner_bg table.contentpaneopen td{
        color: #FFFFFF;
        font-family:Georgia, "Times New Roman", Times, serif;
        font-size:11px;
}

Und hier kommt die Datei vom Template allgemein.
Code:

@charset "utf-8";
input.system-openid, input.com-system-openid {
background : url(http://openid.net/images/login-bg.gif) no-repeat;
background-color : #fff;
background-position : 0 50%;
color : #000;
padding-left : 18px;
}
.system-unpublished {
background : #e8edf1;
border-top : 4px solid #c4d3df;
border-bottom : 4px solid #c4d3df;
}
#system-message {
margin-bottom : 10px;
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-bottom : 10px;
list-style : none;
padding : 10px;
border-top : 3px solid #84a7db;
border-bottom : 3px solid #84a7db;
}
#system-message dt.message {
display : none;
}
#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-message dt.notice {
display : none;
}
#system-message dd.notice ul {
color : #c00;
background : #efe7b8;
border-top : 3px solid #f0dc7e;
border-bottom : 3px solid #f0dc7e;
}
#system-debug {
color : #ccc;
background-color : #fff;
padding : 10px;
margin : 10px;
}
#system-debug div {
font-size : 11px;
}
.invalid {
border-color : #ff0000;
}
label.invalid {
color : #ff0000;
}
#editor-xtd-buttons {
padding : 5px;
}
.button2-left, .button2-right, .button2-left div, .button2-right div {
float : left;
}
.button2-left a, .button2-right a, .button2-left span, .button2-right span {
display : block;
height : 22px;
float : left;
line-height : 22px;
font-size : 11px;
color : #666;
cursor : pointer;
}
.button2-left span, .button2-right span {
cursor : default;
color : #999;
}
.button2-left .page a, .button2-right .page a, .button2-left .page span, .button2-right .page span {
padding : 0 6px;
}
.page span {
color : #000;
font-weight : bold;
}
.button2-left a:hover, .button2-right a:hover {
text-decoration : none;
color : #0b55c4;
}
.button2-left a, .button2-left span {
padding : 0 24px 0 6px;
}
.button2-right a, .button2-right span {
padding : 0 6px 0 24px;
}
.button2-left {
background : url(../images/j_button2_left.png) no-repeat;
float : left;
margin-left : 5px;
}
.button2-right {
background : url(../images/j_button2_right.png) no-repeat 100% 0;
float : left;
margin-left : 5px;
}
.button2-left .image {
background : url(../images/j_button2_image.png) no-repeat 100% 0;
}
.button2-left .readmore {
background : url(../images/j_button2_readmore.png) no-repeat 100% 0;
}
.button2-left .pagebreak {
background : url(../images/j_button2_pagebreak.png) no-repeat 100% 0;
}
.button2-left .blank {
background : url(../images/j_button2_blank.png) no-repeat 100% 0;
}
div.tooltip {
float : left;
background : #ffc;
border : 1px solid #d4d5aa;
padding : 5px;
max-width : 200px;
z-index : 13000;
}
div.tooltip h4 {
padding : 0;
margin : 0;
font-size : 95%;
font-weight : bold;
margin-top : -15px;
padding-top : 15px;
padding-bottom : 5px;
background : url(../images/selector-arrow.png) no-repeat;
}
div.tooltip p {
font-size : 90%;
margin : 0;
}
.img_caption.left {
float : left;
margin-right : 1em;
}
.img_caption.right {
float : right;
margin-left : 1em;
}
.img_caption.left p {
clear : left;
text-align : center;
}
.img_caption.right p {
clear : right;
text-align : center;
}
a img.calendar {
width : 16px;
height : 16px;
margin-left : 3px;
background : url(../images/calendar.png) no-repeat;
cursor : pointer;
vertical-align : middle;
}
html {
height : 100%;
margin-bottom : 1px;
}
form {
display : inline;
}
body {
margin : 0 0 0 0;
padding : 0 0 0 0;
}
body, td {
font-family : Helvetica, Arial, sans-serif;
font-size : 12px;
color : #fff;
line-height : 1.4em;
}
a:link, a:visited {
text-decoration : none;
font-weight : normal;
}
a:hover {
text-decoration : underline;
font-weight : normal;
}
input.button {
cursor : pointer;
}
p {
margin-top : 0;
margin-bottom : 5px;
}
img {
border : 0 none;
}
#page_bg {
background : #16171a url(../images/page_bg.png) repeat-x top left;
}
div.main_bg_center {
margin : 0 auto;
}
div.main_bg_left {
float : left;
}
div.main_bg_right {
float : right;
}
div#main_bg {
width : 1050px;
text-align : left;
background : url(../images/middle_bg.png) repeat-y left;
}
div#middle_bg {
margin : 0 auto;
width : 1050px;
}
div#nologo {
display : block;
float : left;
width : 20px;
}
div#logo_bg {
height : 100px;
margin-left : 7px;
margin-right : 7px;
width : auto;
}
#logo_img {
margin-top : 16px;
margin-left : 16px;
margin-right : 10px;
}
.logo {
display : block;
float : left;
padding-top : 30px;
}
a.logo:link, a.logo:hover, a.logo:visited {
line-height : 28px;
text-decoration : none;
font-weight : bold;
}
a.logo_trebuchet:link, a.logo_trebuchet:hover, a.logo_trebuchet:visited {
font-family : "Trebuchet MS", Tahoma, Verdana;
font-size : 26px;
}
a.logo_tahoma:link, a.logo_tahoma:hover, a.logo_tahoma:visited {
font-family : Tahoma, Verdana, Arial;
font-size : 26px;
}
a.logo_verdana:link, a.logo_verdana:hover, a.logo_verdana:visited {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 26px;
}
a.logo_times:link, a.logo_times:hover, a.logo_times:visited {
font-family : "Times New Roman", Times, serif;
font-size : 26px;
}
a.logo_arial:link, a.logo_arial:hover, a.logo_arial:visited {
font-family : Arial, Helvetica, sans-serif;
font-size : 26px;
}
a.logo_helvetica:link, a.logo_helvetica:hover, a.logo_helvetica:visited {
font-family : Helvetica, Arial, sans-serif;
font-size : 26px;
}
a.logo_georgia:link, a.logo_georgia:hover, a.logo_georgia:visited {
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 26px;
}
a.logo_geneva:link, a.logo_geneva:hover, a.logo_geneva:visited {
font-family : Geneva, Arial, Helvetica, sans-serif;
font-size : 26px;
}
div#user4 {
float : right;
text-align : left;
margin-right : 15px;
}
div#user4 div.search {
width : 290px;
height : 46px;
text-align : left;
padding-top : 9px;
background : url(../images/search_bg.png) no-repeat top right;
}
.search .inputbox {
background : #ffffff;
width : 200px;
height : 16px;
margin-left : 40px;
font-size : 11px;
color : #454545;
padding : 5px 2px 2px 2px;
border : 1px solid #d3d3d3;
}
.input {
padding : 10px 10px 10px 0;
}
div#banner_bg {
height : 216px;
width : 1050px;
margin-top : 5px;
margin-left : 9px;
padding : 0;
}
div.banner1 {
background : url(../images/banner1.jpg) no-repeat top left;
}
div.banner2 {
background : url(../images/banner2.jpg) no-repeat top left;
}
div.banner3 {
background : url(../images/banner3.jpg) no-repeat top left;
}
div.banner4 {
background : url(../images/banner4.jpg) no-repeat top left;
}
div.banner5 {
background : url(../images/banner5.jpg) no-repeat top left;
}
#banner_bg table.contentpaneopen {
margin-top : 25px;
margin-right : 18px;
width : 370px;
float : right;
text-align : left;
}
#user3 {
margin-left : 3px;
margin-right : 3px;
width : auto;
border : 0;
height : 43px;
}
#pillmenu {
text-align : left;
margin : 0;
float : left;
}
#pillmenu ul {
margin : 0;
padding : 0 0 0 8px;
list-style : none;
}
#pillmenu li {
float : left;
margin : 0;
padding : 0;
margin-top : 5px;
}
#pillmenu li a, #pillmenu li a:hover, #active_menu-nav {
font-family : "Trebuchet MS", Tahoma;
font-size : 13px;
float : left;
display : block;
line-height : 30px;
padding : 0 17px 0 17px;
color : #ffffff;
text-decoration : none;
font-weight : bold;
}
#date {
text-align : right;
margin-right : 10px;
float : right;
line-height : 40px;
color : #ffffff;
font-family : Georgia, Tahoma;
font-size : 11px;
}
#leftcolumn {
position:absolute;
left: 105px;
top: 384px;

margin : 0;
padding : 0;
margin-left : 5px;
margin-top : 6px;
width : 175px;
float : left;
}
#rightcolumn {
position: absolute;
left: 970px;
top: 384px;
margin : 0;
padding : 0;
margin-left : 0;
margin-right : 4px;
margin-top : 6px;
width : 175px;
float : right;
}
#maincolumn {
width : 700px;
float : left;
margin-left : 220px;
padding : 0;
}
div.path {
padding : 15px 0 0 15px;
}
div.nopad {
float : left;
padding : 0 55px 5px 0px;
}
div.nopad ul {
clear : both;
}
form#form-login fieldset {
border : none;
margin : 0;
margin-left : 10px;
}
form#form-login ul li {
padding : 0;
}
form#form-login ul li a {
text-align : left;
padding : 0;
font-size : 10px;
color : #858585;
}
#leftcolumn div.moduletable_menu, #leftcolumn div.moduletable, #leftcolumn div.moduletable_text, #rightcolumn div.moduletable_menu, #rightcolumn div.moduletable, #rightcolumn div.moduletable_text {
margin : 2px 0 10px 0;
padding : 0;
width : 193px;
}
#leftcolumn h3, #rightcolumn h3 {
text-align : left;
height : 34px;
width : 175px;
line-height : 33px;
color : #ffffff;
font-size : 12px;
margin : 0 0 0 0;
padding-left : 35px;
}
div.bannergroup_text {
margin : 10px 13px 10px 13px;
}
.bannerheader {
font-weight : bold;
margin-bottom : 10px;
}
.banneritem_text {
margin-bottom : 10px;
}
.bannerfooter_text {
margin-bottom : 10px;
}
table.poll thead td {
text-align : center;
padding-left : 10px;
}
.poll {
margin : 10px 0 10px 0;
}
.poll td {
margin : 0 0 10px 0;
}
table.poll td {
text-align : left;
}
.pollstableborder {
margin : 5px 10px 10px 5px;
}
#leftcolumn ul, #rightcolumn ul {
margin : 10px;
padding : 0 10px 10px 0;
list-style : none;
}
.moduletable ul {
padding : 0 10px 10px 10px;
margin : 0;
}
.moduletable ul li {
padding : 0 0 0 10px;
margin : 0;
line-height : 18px;
}
.moduletable form ul li {
list-style : none;
background : inherit;
}
div.moduletable ul.latestnews {
padding : 0 10px 10px 10px;
margin : 0;
}
ul.latestnews li {
padding : 0 0 0 10px;
margin : 0;
line-height : 18px;
}
div.moduletable ul.mostread {
padding : 0 10px 10px 10px;
margin : 0;
}
ul.mostread li {
padding : 0 0 0 10px;
margin : 0;
line-height : 21px;
}
#leftcolumn ul.menu li#current ul li, #rightcolumn ul.menu li#current ul li {
margin : 0;
padding : 0;
}
div.moduletable ul.menu {
padding : 0 0 10px 15px;
margin : 0;
}
ul.menu {
padding : 0 0 10px 15px;
margin : 0;
}
ul.menu li {
padding : 0 0 0 15px;
margin : 0;
line-height : 21px;
}
ul.menu li#current a {
text-decoration : underline;
color : #ffffff;
}
ul.menu li ul {
padding : 0 0 5px 0;
margin : 0;
}
ul.menu li ul li {
padding : 0 0 0 15px;
}
ul.menu li#current ul li a {
margin-left : 15px;
text-decoration : none;
}
ul.mostread {
padding : 10px 0 10px 15px;
margin : 0;
}
ul.mostread li {
padding : 0 0 0 15px;
margin : 0;
line-height : 21px;
}
ul.latestnews {
padding : 10px 0 10px 15px;
margin : 0;
}
ul.latestnews li {
padding : 0 0 0 15px;
margin : 0;
line-height : 21px;
}
div.componentheading {
font-weight : bold;
font-size : 16px;
margin : 7px auto;
}
td.contentheading, td.buttonheading {
font-weight : bold;
font-size : 14px;
height : 33px;
background : #242424 url(../images/contentheading_line.png) repeat-x bottom;
border : none;
}
table.contentpaneopen {
border-collapse : collapse;
margin-left : 5px;
}
table.contentpaneopen td {
padding : 2px;
}
span.small, td.createdate, td.modifydate {
font-size : 11px;
color : #999999;
}
span.pagination span, span.pagination a {
padding : 5px;
}
div#f_area {
text-align : left;
border-top : 3px solid #4d4c4c;
background : #000000;
margin : 0 auto;
width : 989px;
padding-left : 0;
}
#f_area div.moduletable, #f_area div.moduletable_menu {
margin : 10px 4px 10px 5px;
width : 235px;
}
#f_area h3 {
text-align : left;
height : 34px;
width : 200px;
line-height : 33px;
color : #ffffff;
font-size : 12px;
margin : 0;
padding-left : 35px;
}
#system-message {
margin-bottom : 20px;
}
#system-message dd.message ul {
background : #c3d2e5 url(../../system/images/notice-info.png) no-repeat 4px center;
}
#system-message dd.error ul {
color : #c00;
background : #e6c0c0 url(../../system/images/notice-alert.png) no-repeat 4px center;
border-top : 3px solid #de7a7b;
border-bottom : 3px solid #de7a7b;
margin : 0;
padding-left : 40px;
text-indent : 0;
}
#system-message dd.notice ul {
color : #c00;
background : #efe7b8 url(../../system/images/notice-note.png) no-repeat 4px center;
border-top : 3px solid #f0dc7e;
border-bottom : 3px solid #f0dc7e;
}
#syndicate {
float : left;
padding-left : 25px;
}
#power_by, #power_by a, #power_by a:visited {
color : #858585;
}
a:link, a:visited {
color : #da281f;
text-decoration : underline;
}
a:hover {
color : #da281f;
}
a.logo:link, a.logo:hover, a.logo:visited {
color : #ffffff;
}
div#logo_bg {
background : #ececec url(../images/red/bg_logo.png) repeat-x top;
}
div#sub_banner {
background : #000000 url(../images/red/sub_banner.jpg) no-repeat top left;
width : 1050px;
height : 20px;
margin-left : 9px;
}
#user3 {
background : #b44645 url(../images/red/bg_menu.png) repeat-x top;
}
#pillmenu_left {
width : 4px;
height : 43px;
float : left;
background : #16171a url(../images/red/pillmenu_left.png) no-repeat top left;
}
#pillmenu_right {
width : 4px;
height : 43px;
float : right;
background : #16171a url(../images/red/pillmenu_right.png) no-repeat top left;
}
#pillmenu li a, #pillmenu li a:hover, #active_menu-nav {
color : #ffffff;
background : url(../images/red/menu_hover.png) no-repeat right;
}
#pillmenu li a:hover, #active_menu-nav {
color : #000000;
}
#leftcolumn h3, #leftcolumn div h3, #rightcolumn h3, #rightcolumn div h3 {
background : url(../images/red/bg_h3.png) no-repeat top left;
}
#leftcolumn div.moduletable_menu, #leftcolumn div.moduletable, #leftcolumn div.moduletable_text, #rightcolumn div.moduletable_menu, #rightcolumn div.moduletable, #rightcolumn div.moduletable_text {
background : url(../images/rub_bottom.png) no-repeat left bottom;
}
#f_area div.moduletable_menu, #f_area div.moduletable, #f_area div.moduletable_text {
background : url(../images/rub_footer_bottom.png) no-repeat left bottom;
}
#f_area h3 {
background : url(../images/red/f_area_h3.png) no-repeat top left;
}
a.readon, a.readon:hover, a.readon:visited {
display : block;
height : 30px;
width : 109px;
color : #ffffff;
text-decoration : underline;
padding-left : 20px;
line-height : 23px;
background : url(../images/red/bg_read_more.png) no-repeat top left;
margin : 10px 0 0 0;
}
ul.menu li {
list-style : none;
background : url(../images/red/menu_arrow.png) no-repeat top left;
}
ul.mostread li {
list-style : none;
background : url(../images/red/menu_arrow.png) no-repeat top left;
}
ul.latestnews li {
list-style : none;
background : url(../images/red/menu_arrow.png) no-repeat top left;
}
.moduletable ul li {
list-style : none;
background : url(../images/red/menu_arrow.png) no-repeat top left;
}
div.componentheading {
color : #da281f;
}
#banner_bg table.contentpaneopen td {
color : #ffffff;
font-family : Georgia, "Times New Roman", Times, serif;
font-size : 11px;
}
#uddeim-module {
font-size : 11px;
}
#uddeim-modulenew {
font-size : 11px;
}
#uddeim-module p.uddeim-module-head {
margin : 0;
}
#uddeim-modulenew p.uddeim-module-head {
margin : 0;
}
#uddeim-module p.uddeim-module-body {
margin : 0;
}
#uddeim-modulenew p.uddeim-module-body {
margin : 0;
}
#uddeim-module p.uddeim-module-row {
margin : 0;
}
#uddeim-modulenew p.uddeim-module-row {
margin : 0;
}

Falls ich eine Frage offengelassen haben sollte werde ich das natürlich sofort nachholen. Falls euch durch Zufall noch weitere Fehler in der CSS Datei auffallen sollten, macht mich bitte darauf aufmerksam.

Ich bedanke mich im voraus.

MfG Marvin

heiko_rs 29.12.2009 06:52

Es fehlt nur noch der Link zum Problem.

Wobei ich so schon sagen kann, dass Deine Herangehensweise falsch ist, denn Du verwendest leere divs für Deine BG-Bilder.

marvin1989 29.12.2009 23:55

Oh, entschuldigt, das habe ich in aller Eile vergessen.
Also der derzeitige Link ist dann
http://www.nordenpartys.de/jcms/

danke im voraus.

heiko_rs 30.12.2009 00:35

http://www.nordenpartys.de/jcms/temp.../middle_bg.png enthält die border und ist nicht breit genug. Außerdem gib den Randspalten nicht pos. abs., sondern siehe FAQ 2.


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:56 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Search Engine Friendly URLs by vBSEO 3.6.0
© Dirk H. 2003 - 2017