0
Welcome Guest! Login
0 items Join Now

A little CSS help please [FIXED]

    • Adamck's Avatar
    • Adamck
    • Elite Rocketeer
    • Posts: 546
    • Thanks: 2
    • Web Developer, IT Assistant, Graphics design, App Developer

    A little CSS help please [FIXED]

    Posted 14 years 9 months ago
    • Probably a silly question but...
      Im trying to get a layout with rounded boxes (done) but i want a gap between the main column and the right column that is transparent!

      This image is hidden for guests.
      Please log in or register to see it.


      Ive added padding-right:15px; but it creates a gap with the grey bg, i want a transparent bg.
      .x-c-s #col1 {overflow:hidden; padding-right:15px;}

      This image is hidden for guests.
      Please log in or register to see it.

      /* Main Layout */
      html {height:100%;margin-bottom:1px;}
      body {font:62.5%/1.2 Helvetica, Arial, sans-serif;color:#555;}
      h1,h2,h3,h4,.componentheading {font-weight:bold;margin:2em 0 1em;}
      h1,.componentheading {font-size:180%;}
      h2 {font-size:150%;}
      h3 {font-size:130%;}
      h4 {font-size:110%;}
      a {color:#007EBA;text-decoration:none;font-weight:bold;}
      a:hover {text-decoration:underline;}
      ul {margin:1em;}
      p {margin-top:10px;margin-bottom:10px;}
      #main {font-size:1.3em;line-height:140%;padding-top:25px;}
      .background {position:absolute;width:100%;height:1380px;background:url(../images/bg.png) repeat-x;}
      #main .foreground, #message, #showcase, .leading, #page {position:relative;}
      #message, #showcase {z-index:0;}
      #main-content {border-bottom:1px solid #ddd;}
      .dp20,.dp25,.dp33,.dp50,.dp100 {float:left;margin-top:15px;}
      .dp20 {width:20%;}
      .dp25 {width:25%;}
      .dp33 {width:33.33%;}
      .dp50 {width:50%;}
      .dp100 {width:100%;margin-top:0;}
      .clr {clear:both;font-size:0;}
      #colmask {clear:both;overflow:hidden;position:relative;width:100%;}
      #maincol, #wrapper {position:relative;}
      .s-c-s #colmid, .s-c-x #colright {float:left;position:relative;width:200%;}
      .s-c-s #colright {float:left;left:50%;position:relative;width:100%;}
      .s-c-s #col1wrap {float:right;position:relative;right:100%;width:50%;}
      .s-c-s #col1pad {overflow:hidden;}
      .x-c-s #col1 {overflow:hidden; padding-right:15px;}
      .x-c-s #colmid {overflow:hidden;}
      .s-c-s #col1 {overflow:hidden;width:100%;}
      .s-c-s #col2 {float:left;position:relative;overflow:hidden;margin-left:-50%;}
      .s-c-s #col3 {float:left;position:relative;overflow:hidden;left:0;}
      .s-c-x #col1wrap {float:right;position:relative;width:50%;}
      .s-c-x #col1 {overflow:hidden;position:relative;right:100%;}
      .s-c-x #col2 {float:left;position:relative;}
      .x-c-s #colright {float:left;position:relative;right:100%;width:200%;}
      .x-c-s #col1wrap {float:left;left:50%;position:relative;width:50%;}
      .x-c-s #col3 {float:right;position:relative;}
      .s-c-s .ctr-color1, .s-c-s .ckl-color1, .s-c-x .ckl-color1, .x-c-s .cdr-color1 {background:#f2f2f2;}
      .s-c-s .ctr-color2, .s-c-s .ckl-color2, .s-c-x .ckl-color2, .x-c-s .cdr-color2 {background:#d1e0e7;}
      .s-c-s #col1pad, .s-c-x #colright, .x-c-s #colright, #wrapper, body {background:none;}
      .cols1 {display:block;float:none;margin:0;width:100%;}
      .cols2 {width:49%;overflow:hidden;}
      .cols3 {width:30%;}
      .column1, .column2 {position:relative;float:left;margin:0;}
      .colpad {padding:0 10px;position:relative;}
      .column2 {float:right;width:49%;}
      .article_row {overflow:hidden;margin:0 -10px 15px -10px;}
      .block-bg {background: #f2f2f2;margin: 0 13px;height: 13px;}
      .block-tr {background: url(../images/corner-white-tr.png) 100% 0 no-repeat;margin-right: -13px;}
      .block-tl {background: url(../images/corner-white-tl.png) 0 0 no-repeat;height: 13px;margin-left: -13px;}
      .block-br {background: url(../images/corner-white-br.png) 100% 0 no-repeat;margin-right: -13px;}
      .block-bl {background: url(../images/corner-white-bl.png) 0 0 no-repeat;height: 13px;margin-left: -13px;}

      Im using Afterburner theme, i managed to round the maincontent off but cant seem to get a gap beween them.
      HELP!
      http://72.29.71.247/~plante/index.php
    • Last Edit: 14 years 9 months ago by Adamck.
    • Kiss my RSS
    • Adamck's Avatar
    • Adamck
    • Elite Rocketeer
    • Posts: 546
    • Thanks: 2
    • Web Developer, IT Assistant, Graphics design, App Developer

    Re: A little CSS help please [FIXED]

    Posted 14 years 9 months ago
    • Doesnt matter, fixed it now.
      :cheesy:
    • Kiss my RSS

Time to create page: 0.066 seconds