Remove margins



  • Hello, I am Korean!

    How do I remove the right margin? (red line area)

    0_1508509735960_제목 없음.png

    Left margin has been removed with [[body {margin: 0px;]]](/home/pi/MagicMirror/css/main.css)

    But how do you remove the right margin?

    html {
      cursor: none;
      overflow: hidden;
      background: #000;
    }
    
    ::-webkit-scrollbar {
      display: none;
    }
    
    body {
      margin: 0px;
      position: absolute;
      height: calc(100% - 120px);
      width: calc(100% - 120px);
      background: #000;
      color: #aaa;
      font-family: "Roboto Condensed", sans-serif;
      font-weight: 400;
      font-size: 2em;
      line-height: 1.5em;
      -webkit-font-smoothing: antialiased;
    }
    
    /**
     * Default styles.
     */
    
    .dimmed {
      color: #666;
    }
    
    .normal {
      color: #999;
    }
    
    .bright {
      color: #fff;
    }
    
    .xsmall {
      font-size: 15px;
      line-height: 20px;
    }
    
    .small {
      font-size: 20px;
      line-height: 25px;
    }
    
    .medium {
      font-size: 30px;
      line-height: 35px;
    }
    
    .large {
      font-size: 65px;
      line-height: 65px;
    }
    
    .xlarge {
      font-size: 75px;
      line-height: 75px;
      letter-spacing: -3px;
    }
    
    .thin {
      font-family: Roboto, sans-serif;
      font-weight: 100;
    }
    
    .light {
      font-family: "Roboto Condensed", sans-serif;
      font-weight: 300;
    }
    
    .regular {
      font-family: "Roboto Condensed", sans-serif;
      font-weight: 400;
    }
    
    .bold {
      font-family: "Roboto Condensed", sans-serif;
      font-weight: 700;
    }
    
    .align-right {
      text-align: right;
    }
    
    .align-left {
      text-align: left;
    }
    
    header {
      text-transform: uppercase;
      font-size: 15px;
      font-family: "Roboto Condensed";
      font-weight: 400;
      border-bottom: 1px solid #666;
      line-height: 15px;
      padding-bottom: 5px;
      margin-bottom: 10px;
      color: #999;
    }
    
    sup {
      font-size: 50%;
      line-height: 50%;
    }
    
    /**
     * Module styles.
     */
    
    .module {
      margin-bottom: 30px;
    }
    
    .region.bottom .module {
      margin-top: 30px;
      margin-bottom: 0;
    }
    
    .no-wrap {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    
    /**
     * Region Definitions.
     */
    
    .region {
      position: absolute;
    }
    
    .region.fullscreen {
      position: absolute;
      top: -60px;
      left: -60px;
      right: -60px;
      bottom: -60px;
      pointer-events: none;
    }
    
    .region.fullscreen * {
      pointer-events: auto;
    }
    
    .region.right {
      right: 0;
    }
    
    .region.top {
      top: 0;
    }
    
    .region.top .container {
      margin-bottom: 25px;
    }
    
    .region.top .container:empty {
      margin-bottom: 0;
    }
    
    .region.top.center,
    .region.bottom.center {
      left: 50%;
      -moz-transform: translateX(-50%);
      -o-transform: translateX(-50%);
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    
    .region.top.right,
    .region.top.left,
    .region.top.center {
      top: 100%;
    }
    
    .region.bottom {
      bottom: 0;
    }
    
    .region.bottom .container {
      margin-top: 25px;
    }
    
    .region.bottom .container:empty {
      margin-top: 0;
    }
    
    .region.bottom.right,
    .region.bottom.center,
    .region.bottom.left {
      bottom: 100%;
    }
    
    .region.bar {
      width: 100%;
      text-align: center;
    }
    
    .region.third,
    .region.middle.center {
      width: 100%;
      text-align: center;
      -moz-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      transform: translateY(-50%);
    }
    
    .region.upper.third {
      top: 33%;
    }
    
    .region.middle.center {
      top: 50%;
    }
    
    .region.lower.third {
      top: 66%;
    }
    
    .region.left {
      text-align: left;
    }
    
    .region.right {
      text-align: right;
    }
    
    .region table {
      width: 100%;
      border-spacing: 0;
      border-collapse: separate;
    }
    
    

  • Module Developer

    @wireshark said in Remove margins:

    width: calc(100% - 120px);

    I think it could be. (아마 이 부분일 겁니다. ^^; 여기서 한국인 처음 뵙네요.)



  • @Sean 정말 감사합니다!! ^^


  • Module Developer

    @wireshark 아, 그리고 update할 때 골치아플 수 있으니, main.css를 직접 수정하지 마시고, custom.css에 overwrite 하세요.



  • @Sean 아 한국분이셨구나ㅎㅎ; 자동으로 업데이트 되는건 아니지요??
    업데이트 관련 링크 어디서 찾을 수 있을까요??


  • Module Developer

    @wireshark 그냥 포럼이나 github 보시면 되요. 프로젝트 특성상 잘 돌아가고 있으면 업데이트 안하셔도 됩니다.



  • @Sean 감사합니다!


  • Module Developer

    @Sean

    This one if all yours Sean. :^)


Log in to reply
 

Looks like your connection to MagicMirror Forum was lost, please wait while we try to reconnect.