How to change width of Prosilver style same like Prosilver Special

[AT90]

Hi, i want ask, how i can change Prosilver width to same width like in Prosilver Special Edition. (Special Edition theme is a bit narrow width)
Perhaps some change will be needed - wrap ?

Thanks

[Lumpy Burgertushie]

yes, change the width of the wrap in common.css

however, it would be much easier and better in the long run to just use prosilver se and then you don't have to worry about it.

robert

[AT90]

I use default Prosilver style, but i need in this style same width like in Prosilver Special.

[warmweer]

common css. line 140 (I just copied this but I may have edited it in the past so I'm not sure that the 1152 is the default value). You can use your browser's style-editor to see the result of any changes you may want to make.

Code: Select all

.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin: 0 auto;
	max-width: 1152px;
	min-width: 625px;
	padding: 15px;
}

@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
	.wrap {
		margin: 0 12px;
	}
}

[AT90]

Thanks but i find this in Prosilver Special stylesheet.css

Code: Select all

/*  phpBB3 Style Sheet
    --------------------------------------------------------------
	Style name:			prosilver Special Edition
	Based on style:		prosilver (the default phpBB 3.2.x style)
	Original author:	Tom Beddard ( http://www.subblue.com/ )
	Modified by:		phpBB Limited ( https://www.phpbb.com/ )
    --------------------------------------------------------------
*/

/* colours.css changes */
html, body {
	background-color: #ACA8A1;
}

body.simple {
	min-height: 100%;
	padding: 0 5px;
}

.wrap {
	max-width: 850px;
	margin: 0 auto;
	padding: 13px 23px;
	border: 2px solid #FFF;
	border-radius: 15px;
	box-shadow: 0 0 5px 2px #9D9A93, inset 0 3px 18px rgba(100, 100, 100, .25);
}

.search-header {
	box-shadow: 0 0 10px #505C65;
}

.headerbar {
	background-color: #7C8891;
	background-image: url("./images/bg_header.gif");
}

.navbar {
	background-color: #DCDEE2;
}

.forabg, .forumbg {
	background-color: #505C65;
	background-image: url("./images/bg_list.gif");
}

.copyright a {
	color: #000000 !important;
}

li.row {
	background-color: #E8ECEE;
}

li.row:hover {
	background-color: #EBEFF1;
}

li.row.bg3 {
	background-color: #F0F4F6;
}

li.row.bg3:hover {
	background-color: #F4F8FA;
}

.site_logo {
	background-image: url("./images/site_logo.gif");
}

/* responsive.css changes */
@media only screen and (max-width: 920px), only screen and (max-device-width: 920px) {
	html, body {
		background-color: #FFF;
	}

	body {
		padding-left: 5px;
		padding-right: 5px;
	}

	#wrap {
		width: 850px;
		padding: 0;
		border-width: 0;
		border-radius: 0;
		box-shadow: none;
	}
}

@media only screen and (max-width: 860px), only screen and (max-device-width: 860px) {
	#wrap {
		width: auto;
	}
}

[Lumpy Burgertushie]

you don't need to change anything in prosilver _se. you need to edit the line in prosilver common.css to those in the prosliver_se stylesheet related to width.

[Donald Laborde]

Hi there, that's great but it doesn't change anything viewing on a mobile. Need it another change elsewhere ?

[Talk19Zehn]

Hi, perhaps test this - a simple starting point

common.css: find the original

Code: Select all

.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin: 0 auto;
	max-width: 1152px;
	min-width: 625px;
	padding: 15px;
}

@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
	.wrap {
		margin: 0 12px;
	}
}

1) change it to:

Code: Select all

.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin: 0 auto;
	max-width: 850px;
	padding: 15px;
}

@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
	.wrap {
	max-width: 850px;
	}
}

2) or change the original to:

Code: Select all

.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin: 0 auto;
	max-width: 850px;
	padding: 15px;
}

@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
	.wrap {
	max-width: 1152px;
	margin: 0 12px auto;
	}
}

BTW: The better way is to use a custom.css

[Bela91]

Code: Select all

/* Main blocks
---------------------------------------- */
.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin-left: auto;
	margin-right: auto;
	max-width: 1100px;
	min-width: 625px;
	padding: 15px;
}

hey i changed it max-width: 1100px; but still see the same page also refresh page with css common.css ? I use style: ne-blackgreen

[warmweer]

hey i changed it max-width: 1100px; but still see the same page also refresh page with css common.css ? I use style: ne-blackgreen

You probably need to clear board and browser cache.

[Bela91]

You probably need to clear board and browser cache.

clean board and cache in catalog whole in hosting? remove red ?

[Mannix_]

the button in ACP is enough. To clear your browser cache click ctrl + f5

[P_I]

Why code it and have to maintain it? Wouldn't it be simpler to use the Set forum width extension.

[warmweer]

Clearing board cache through FTP is nothing more than deleting /production (in /cache) (or as Mannix stated: using the ACP)
BTW, there's no point in keeping /installer.

[Bela91]

when i change language found it