블로그 컨텐츠 width 값을 어떻게 바꿀 수 있을까요. – 한국워드프레스사용자모임 https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/feed Sun, 12 Jan 2025 13:57:59 +0000 https://bbpress.org/?v=2.6.9 ko-KR https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3814 <![CDATA[블로그 컨텐츠 width 값을 어떻게 바꿀 수 있을까요.]]> https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3814 Sun, 11 Oct 2009 07:13:26 +0000 bilm 폭을 조정하고 싶다면 width: XX em 또는 width: XX px라고 되어 있는 부분을 조정하시면 됩니다.

CSS를 보고 판단한 사이트 모습은 #content, #sidebar로 구성되어 있는 2단 레이아웃이로군요.
#content의 width가 40em, #sidebar가 20em입니다.
합이 60em이군요.
가로 폭이 60em 이면 상당히 좁습니다. #content의 width를 40em에서 더 큰 수로 바꿔주시면 본문의 폭이 더 넓어지게 될 것입니다.

Avatar of bilm
bilm
]]> https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3815 <![CDATA[Reply To: 블로그 컨텐츠 width 값을 어떻게 바꿀 수 있을까요.]]> https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3815 Sun, 11 Oct 2009 07:13:26 +0000 bilm 안녕하세요 지난번에 이 곳에서 큰도움을 받은 초보 유저입니다.
다름이 아니라 제가 포스팅할때
width값이 500px 정도 밖에 안되는 것 같은데 수정하는 방법을 잘 모르겠습니다. ㅠㅠ
저는 frog 라는 테마를 칼라와 이미지등을 조금 바꿔서 사용하고 있구요.
현재 style.css 의 코드는 다음과 같습니다.
고수님들의 도움을 기다리겠습니다.


body {
    margin:         50px 0 80px 40px;
   background:     #fff;
         background-image:url('images/bg.jpg');
   font-size:      9pt;
   line-height:    1.5;
   color:          #444;
   font-family:    Verdana, Helvetica, sans-serif;
}
blockquote {
    margin:         1em 0 1em 1em;
    padding:        0;
   font-size:      9pt;
    font-style:     italic;
    color:          #777;
}
blockquote p {
   padding: 0px;
   margin: 0px;
}
pre {
    font-family:'Courier New', Courier, Monospace, Fixed;
   line-height: normal;
    overflow: auto;
   padding-bottom: 2em;
   margin: 0px;
   background-image:url('images/bg_pre_dots.png');
   background-repeat: repeat-x;
   background-position: bottom left;
}
cite {
   font-style:     italic;
    color:          #777;
}
img {padding: 0; margin: 0;}
a {text-decoration: none; color: #000;}
a:hover {color: #fd8008;}
h1, h2, h3 {font-size: 100%;}
h2, h3, h4, h5, h6 {color: #888;}
dl, dd, dt {margin: 0px;}

.clear {
   clear:both;
   height:1px;
}

.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}
#wrapper {
   width: 99%;
   text-align:left;
}

/* header */

#hd {
    padding:        2px 0 10px 90px;
   margin-bottom:  4em;
    background:     url() left bottom no-repeat;
}

div#hd div#hline {
    height:         1px;
    width:          90%;
    border-bottom:  1px solid #ddd;
    position:       absolute;
    top:            65px;
    right:          0;
    z-index:        -1;
}

#sitemeta {
    position:       absolute;
    right:          12px;
    top:            0;
   font-size:      8pt;
    width:          20em;
    text-align:     right;

}

#sitemeta ul{list-style: none;}
#sitemeta a {color: #aaa;}
#sitemeta a:hover {color: #000;}

#blogtitle h1 {display: inline;}
#blogtitle h1 a {
   color:          #fd8008;        /* orange */
   font-size:      13pt;
   vertical-align: bottom;
    background:     #fff;
    background-image:url('images/bg.jpg');
    padding:        0 1em;
    margin-left:    -1em;
}
#blogdescription {
   color:          #666;
   font-size:      9pt;
}
#menu {
   margin-top:     1em;
   display:        inline;
}
#menu ul {
   list-style:     none outside;
   margin:         0px;
   padding:        0px;
}
#menu ul li {
   float:          left;
}
#menu ul li a {
   font-size:      10pt;
   padding-left:   1em;
   margin-left:    1em;
   color:          #999;
}
#menu ul li a:hover {
   color:          #fd8008;     /* orange */
}

/* sidebar */

#sidebar {   
    font-size:      8pt;
   width:          20em;
    background:     #fff;
    background-image:url('images/bg.jpg');
   position:       absolute;
    top:            66px;
    right:          0;
    padding:        0 0 2em 1em;
   color:          #ccc;
    text-align:     left;
    border-left:    1px solid #ddd;
}
#sidebar ul {
   list-style:     none outside;
   margin:         0px;
   padding:        0px;
}
#sidebar ul li {display: inline;}
#sidebar ul li ul {
   list-style:     none outside;
   margin-top:     0.4em;
   margin-bottom:  1em;
}
li.vategories ul {
   list-style:     none outside;
   margin-top:     1em;
   margin-bottom:  1em;
}
#sidebar ul li ul li {
   margin-top:     0.4em;
   display:        block;
}
#sidebar a {
   color:          #aaa;
           
}
#sidebar a:hover {
   color:          #000;
}
#sidebar h2 {
    color:          #87d744;
   font-size:      8pt;
   font-weight:    bold;
   display:        inline;
}
#sidebar input {border: 1px solid #ddd;}
input#searchsubmit {
    background:     #fff;
    color:          #bbb;
}

/* content */

#content, .searchresults, .page, .categories, .archives, .linkspage {
   padding:    0 0 0 0;
   margin:     0 0 0 20px;
   float:      left;
   width:      40em;
   text-align: left;
}
#content a {
   color: #000;
   text-decoration: none;
}
#content a:hover {
   color: #fd8008;     /* orange */
}
#content h1, .post-wrap h1, h2.post-title {
   display: inline;
   font-size: 10pt;
   text-decoration: none;
   color: #fd8008;     /* orange */
}
#content h1 a, .post-wrap h1 a, h2.post-title a {
   color: #444;
   text-decoration: none;
   color: #fd8008;     /* orange */
}

#content h2 {
   display: inline;
   text-decoration: none;
}
#content h2 a {
   color: #444;
   font-size: 14pt;
}
#content img {
    border:     1px solid #999;
    margin:     1em 0;
}
#content table, #content table tr, #content table tr td, #content table thead th {
    border:     none;
    margin:     1em 0;
    padding:    0;
    font-weight: normal;
    padding-right: 1em;
}

.post-content {
   clear:      both;
   padding:    10px 0;
   margin:     0;
}
#content ul, #content ol {
    list-style-position: inside;
    margin:     1em 0 1em 1em;
    padding:    0;
}
.post {clear: both;}
.post-date {
   width:      50px;
   height:     50px;
   float:      left;
}
.post-month {
   font-size:  8pt;
   color:      #fff;
   text-align: center;
   display:    block;
   padding:    2px;
   background: #87d744;        /* green */
   text-transform: uppercase;
}
.post-day {
   font-size:      8pt;
   color:          #555;
   text-align:     center;
   display:        block;
   background:     #fff;
   border-bottom:  1px solid #87d744;
   border-right:   1px solid #87d744;
   border-left:    1px solid #87d744;
   padding:        2px;
   line-height:    8pt;
   text-transform: uppercase;
}
.post-meta {
    font-size:      8pt;
    color:          #505050;
}
.post-meta p {margin: 0;}
.post-wrap {
   margin-left:    70px;
   padding-bottom: 1em;
   margin-bottom:  2em;
}

/* comments */

#commentwrap h3 {
    font-size:  9pt;
    color:      #666;
}
#commentwrap ol li {
    margin:     3em 0;
}
#commentwrap input, #commentwrap textarea {
    border:     1px solid #999;
    padding:    0.2em 0.4em;
}
#commentwrap .url {
    font-weight:    normal;
}
#commentwrap {margin-left: 70px;}
#respond {padding-top: 1em;}
.comment-meta {font-size: 8pt; margin: 0;}
#commentwrap ol {
    list-style-type: none;
    margin: 0; padding: 0;
}
#commentwrap input#submit {
    color:      #505050;
    border:     1px solid #999;
    background: #fff;
}
.searchresults ul, .categories ul, .archives ul, .linkspage ul, .archives ul {
   list-style: none;
    margin: 0;
    padding: 0;
}

/* nav */
.nav {margin-left: 70px;}
.previous, .next {display: inline;}
.previous {padding-right: 1em;}
.next {padding-left: 1em;}

/* footer */
#footnote {
    font-size:  8pt;
    color:      #aaa;
    text-align: right;
    margin:     4em 10px 0 0;
}
#footnote a {color: #999;}
#footnote a:hover {color: #000;}
#footnote ul {list-style-type: none;}

/* wordpress */
.imgl {
border:0;
float:left;
margin:0;
padding:0;
}
.imgr {
border:0;
float:right;
margin:0;
padding:0;
}
.wp-caption {
font-size: 8pt;
margin-top: 1em;
}
.wp-caption p {
margin: 0.2em 0 0 0;
}

Avatar of bilm
bilm
]]> https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3816 <![CDATA[Reply To: 블로그 컨텐츠 width 값을 어떻게 바꿀 수 있을까요.]]> https://kopress.kr/topic/%eb%b8%94%eb%a1%9c%ea%b7%b8-%ec%bb%a8%ed%85%90%ec%b8%a0-width-%ea%b0%92%ec%9d%84-%ec%96%b4%eb%96%bb%ea%b2%8c-%eb%b0%94%ea%bf%80-%ec%88%98-%ec%9e%88%ec%9d%84%ea%b9%8c%ec%9a%94/#post-3816 Sun, 11 Oct 2009 07:13:26 +0000 bilm 안녕하세요 지난번에 이 곳에서 큰도움을 받은 초보 유저입니다.
다름이 아니라 제가 포스팅할때
width값이 500px 정도 밖에 안되는 것 같은데 수정하는 방법을 잘 모르겠습니다. ㅠㅠ
저는 frog 라는 테마를 칼라와 이미지등을 조금 바꿔서 사용하고 있구요.
현재 style.css 의 코드는 다음과 같습니다.
고수님들의 도움을 기다리겠습니다.


body {
    margin:         50px 0 80px 40px;
   background:     #fff;
         background-image:url('images/bg.jpg');
   font-size:      9pt;
   line-height:    1.5;
   color:          #444;
   font-family:    Verdana, Helvetica, sans-serif;
}
blockquote {
    margin:         1em 0 1em 1em;
    padding:        0;
   font-size:      9pt;
    font-style:     italic;
    color:          #777;
}
blockquote p {
   padding: 0px;
   margin: 0px;
}
pre {
    font-family:'Courier New', Courier, Monospace, Fixed;
   line-height: normal;
    overflow: auto;
   padding-bottom: 2em;
   margin: 0px;
   background-image:url('images/bg_pre_dots.png');
   background-repeat: repeat-x;
   background-position: bottom left;
}
cite {
   font-style:     italic;
    color:          #777;
}
img {padding: 0; margin: 0;}
a {text-decoration: none; color: #000;}
a:hover {color: #fd8008;}
h1, h2, h3 {font-size: 100%;}
h2, h3, h4, h5, h6 {color: #888;}
dl, dd, dt {margin: 0px;}

.clear {
   clear:both;
   height:1px;
}

.aligncenter {
   display: block;
   margin-left: auto;
   margin-right: auto;
}

.alignleft {
   float: left;
}

.alignright {
   float: right;
}
#wrapper {
   width: 99%;
   text-align:left;
}

/* header */

#hd {
    padding:        2px 0 10px 90px;
   margin-bottom:  4em;
    background:     url() left bottom no-repeat;
}

div#hd div#hline {
    height:         1px;
    width:          90%;
    border-bottom:  1px solid #ddd;
    position:       absolute;
    top:            65px;
    right:          0;
    z-index:        -1;
}

#sitemeta {
    position:       absolute;
    right:          12px;
    top:            0;
   font-size:      8pt;
    width:          20em;
    text-align:     right;

}

#sitemeta ul{list-style: none;}
#sitemeta a {color: #aaa;}
#sitemeta a:hover {color: #000;}

#blogtitle h1 {display: inline;}
#blogtitle h1 a {
   color:          #fd8008;        /* orange */
   font-size:      13pt;
   vertical-align: bottom;
    background:     #fff;
    background-image:url('images/bg.jpg');
    padding:        0 1em;
    margin-left:    -1em;
}
#blogdescription {
   color:          #666;
   font-size:      9pt;
}
#menu {
   margin-top:     1em;
   display:        inline;
}
#menu ul {
   list-style:     none outside;
   margin:         0px;
   padding:        0px;
}
#menu ul li {
   float:          left;
}
#menu ul li a {
   font-size:      10pt;
   padding-left:   1em;
   margin-left:    1em;
   color:          #999;
}
#menu ul li a:hover {
   color:          #fd8008;     /* orange */
}

/* sidebar */

#sidebar {   
    font-size:      8pt;
   width:          20em;
    background:     #fff;
    background-image:url('images/bg.jpg');
   position:       absolute;
    top:            66px;
    right:          0;
    padding:        0 0 2em 1em;
   color:          #ccc;
    text-align:     left;
    border-left:    1px solid #ddd;
}
#sidebar ul {
   list-style:     none outside;
   margin:         0px;
   padding:        0px;
}
#sidebar ul li {display: inline;}
#sidebar ul li ul {
   list-style:     none outside;
   margin-top:     0.4em;
   margin-bottom:  1em;
}
li.vategories ul {
   list-style:     none outside;
   margin-top:     1em;
   margin-bottom:  1em;
}
#sidebar ul li ul li {
   margin-top:     0.4em;
   display:        block;
}
#sidebar a {
   color:          #aaa;
           
}
#sidebar a:hover {
   color:          #000;
}
#sidebar h2 {
    color:          #87d744;
   font-size:      8pt;
   font-weight:    bold;
   display:        inline;
}
#sidebar input {border: 1px solid #ddd;}
input#searchsubmit {
    background:     #fff;
    color:          #bbb;
}

/* content */

#content, .searchresults, .page, .categories, .archives, .linkspage {
   padding:    0 0 0 0;
   margin:     0 0 0 20px;
   float:      left;
   width:      40em;
   text-align: left;
}
#content a {
   color: #000;
   text-decoration: none;
}
#content a:hover {
   color: #fd8008;     /* orange */
}
#content h1, .post-wrap h1, h2.post-title {
   display: inline;
   font-size: 10pt;
   text-decoration: none;
   color: #fd8008;     /* orange */
}
#content h1 a, .post-wrap h1 a, h2.post-title a {
   color: #444;
   text-decoration: none;
   color: #fd8008;     /* orange */
}

#content h2 {
   display: inline;
   text-decoration: none;
}
#content h2 a {
   color: #444;
   font-size: 14pt;
}
#content img {
    border:     1px solid #999;
    margin:     1em 0;
}
#content table, #content table tr, #content table tr td, #content table thead th {
    border:     none;
    margin:     1em 0;
    padding:    0;
    font-weight: normal;
    padding-right: 1em;
}

.post-content {
   clear:      both;
   padding:    10px 0;
   margin:     0;
}
#content ul, #content ol {
    list-style-position: inside;
    margin:     1em 0 1em 1em;
    padding:    0;
}
.post {clear: both;}
.post-date {
   width:      50px;
   height:     50px;
   float:      left;
}
.post-month {
   font-size:  8pt;
   color:      #fff;
   text-align: center;
   display:    block;
   padding:    2px;
   background: #87d744;        /* green */
   text-transform: uppercase;
}
.post-day {
   font-size:      8pt;
   color:          #555;
   text-align:     center;
   display:        block;
   background:     #fff;
   border-bottom:  1px solid #87d744;
   border-right:   1px solid #87d744;
   border-left:    1px solid #87d744;
   padding:        2px;
   line-height:    8pt;
   text-transform: uppercase;
}
.post-meta {
    font-size:      8pt;
    color:          #505050;
}
.post-meta p {margin: 0;}
.post-wrap {
   margin-left:    70px;
   padding-bottom: 1em;
   margin-bottom:  2em;
}

/* comments */

#commentwrap h3 {
    font-size:  9pt;
    color:      #666;
}
#commentwrap ol li {
    margin:     3em 0;
}
#commentwrap input, #commentwrap textarea {
    border:     1px solid #999;
    padding:    0.2em 0.4em;
}
#commentwrap .url {
    font-weight:    normal;
}
#commentwrap {margin-left: 70px;}
#respond {padding-top: 1em;}
.comment-meta {font-size: 8pt; margin: 0;}
#commentwrap ol {
    list-style-type: none;
    margin: 0; padding: 0;
}
#commentwrap input#submit {
    color:      #505050;
    border:     1px solid #999;
    background: #fff;
}
.searchresults ul, .categories ul, .archives ul, .linkspage ul, .archives ul {
   list-style: none;
    margin: 0;
    padding: 0;
}

/* nav */
.nav {margin-left: 70px;}
.previous, .next {display: inline;}
.previous {padding-right: 1em;}
.next {padding-left: 1em;}

/* footer */
#footnote {
    font-size:  8pt;
    color:      #aaa;
    text-align: right;
    margin:     4em 10px 0 0;
}
#footnote a {color: #999;}
#footnote a:hover {color: #000;}
#footnote ul {list-style-type: none;}

/* wordpress */
.imgl {
border:0;
float:left;
margin:0;
padding:0;
}
.imgr {
border:0;
float:right;
margin:0;
padding:0;
}
.wp-caption {
font-size: 8pt;
margin-top: 1em;
}
.wp-caption p {
margin: 0.2em 0 0 0;
}

Avatar of bilm
bilm
]]>