Problem on max page width not work

  • Hi all,

    Problem on max page width not work.

    site:
    phgallery4.reynoldstocks.com

    I already have following lines on /twentyeleven-child/style.css

    @import url("../twentyeleven/style.css");
#page { max-width: 1200px;
}

    But it doesn’t work.

    ~/twentyeleven-child/style.css

    Theme Name:     Twenty Eleven Child
Theme URI:      https://phgallery4.reynoldstocks.com/
Description:    Child theme for the Twenty Eleven theme
Template:       twentyeleven
Version:        0.1.0
*/
@import url("../twentyeleven/style.css");
#site-description {
   color: yellow;
	font-size: 14px;
   font-weight:bold;
	margin: 0 270px 3.65625em 0;
}
.entry-title,
.entry-title a {
    color: #222;
	text-decoration: none;
}
.entry-title a:hover {
    color: darkgreen; }
.entry-title a:focus {color: red}
.entry-title a:active {
    color: #1982d1;
}
#branding {
    border-top: 2px solid #bbb;
    padding-bottom: 10px;
	position: relative;
	z-index: 9999;
	background: #309971;
}
#primary {
	float: left;
	margin: 0 -26.4% 0 0;
	width: 100%;
	background: #d4e2c3
}
pre {
    background: #b6cfea;
	font: 13px "Courier 10 Pitch", Courier, monospace;
	line-height: 1.5;
	margin-bottom: 1.625em;
	overflow: auto;
	padding: 0.75em 1.625em;
}
#site-title a:active {
    color: #5a90ed;
}
.singular .entry-header,
.singular .entry-content,
.singular .footer.entry-meta,
.singular #comments-title {
	width: 94.3396%;
	/* 94.3396% of 848px is 800px  */
}
#site-title a {
color: red;
}
@import url("../twentyeleven/style.css");
#page { max-width: 1200px;
}
img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img {
border: none;
}
body #cimy_div_id_0 {
    border: 1px solid #000000;
    float: left;
    height: 288px;
    margin: 1em auto;
    width: 1200px;
}

    Please shed me some light. Thanks

    Regards
    satimis

Viewing 2 replies - 1 through 2 (of 2 total)
  • .

    (@techievous)

    Weird, that child theme’s style.css is rather inconsistent. It looks as if it has been written by multiple people.

    Anyhow . . .

    1. Please start by removing the second @import url(“../twentyeleven/style.css”); in your child theme’s CSS. It doesn’t belong there. You’ve already imported the parent theme’s style.css with your first @import at the beginning.

    2. #page { max-width: 1200px;} alone should work. Have you try to clear your browser’s cache after updating the code? YOu need to do that everytime you update your style.css.

    Thread Starter satimis

    (@satimis)

    Hi,

    Thanks for your advice.

    It doesn’t solve the problem after removing the second;
    @import url(“../twentyeleven/style.css”);

    I have cleared the browser’s cache.

    On https://phgallery5.reynoldstocks.com

    /twentyeleven-child/style.css

    Theme Name:     Twenty Eleven Child
Theme URI:      https://phgallery5.reynoldstocks.com
Description:    Child theme for the Twenty Eleven theme
Template:       twentyeleven
Version:        0.1.0
*/
@import url("../twentyeleven/style.css");
#branding {
    border-top: 2px solid #bbb;
    padding-bottom: 10px;
	position: relative;
	z-index: 9999;
	background: #6a9ee2;
}
#site-description {
   color: #ffffff;
	font-size: 14px;
	font-weight:bold;
	margin: 0 270px 3.65625em 0;
}
.entry-title,
.entry-title a {
    color: #80c64d;
	text-decoration: blink;
}
#site-title a:hover,
#site-title a:focus,
#site-title a:active {
    color: #5a90ed;
}
#primary {
    float: left;
	margin: 0 -26.4% 0 0;
	width: 100%;
	background: #d9e6f7;
}
#site-title a {
color: red;
}
pre {
    background: #b6cfea;
	font: 13px "Courier 10 Pitch", Courier, monospace;
	line-height: 1.5;
	margin-bottom: 1.625em;
	overflow: auto;
	padding: 0.75em 1.625em;
}
.page-template-fullwidth-php #content { width: 100%; margin: 0;
}
.page-template-fullwidth-php .entry-content, .page-template-fullwidth-php .entry-header{ width: 90%;
}
.singular .entry-header,
.singular .entry-content,
.singular footer.entry-meta,
.singular #comments-title {
    width: 94.3396%;
	/* 94.3396% of 848px is 800px  */
}
embed, iframe, object { display:block; margin: 0 auto; }
@import url("../twentyeleven/style.css");
#page { max-width: 1200px;
}
img[class*="align"], img[class*="wp-image-"], #content .gallery .gallery-icon img {
border: none;
}

    It works.

    Regards
    satimis

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Problem on max page width not work’ is closed to new replies.