change of site width or move the sidebar out of the content area.

Tagged: site width

This topic has 8 replies, 3 voices, and was last updated 2 years ago by Sakin.

Viewing 9 posts - 1 through 9 (of 9 total)

Author

Posts
October 25, 2022 at 9:14 pm #312016

Kattenfotografie.com
Participant

Hi,

I hope you can help. For the desktop I want to change my site width or move the sidebar out of the content area. Before I had no sidebar and I loved the width. Now I want to use the sidebar, however the content width is getting to small for my liking. I prefered to have the full width (1240 px) for the content and an expention for the sidebar (the menu, header and footer have to expand also, so full width is instead of 1240 px for example 1480 px which I can divided in 240 px for the sidebar and 1240 px for the content). An other solution is placing the sidebar in the margin instead of the content area.

I hope you can understand what I mean and give me a solution. Thanks in advance!

Best Regards,

Ellen

http://www.kattenfotografie.com

October 25, 2022 at 9:31 pm #312026
tikaram
Participant
@kattenfotografie-com : Login to your WordPress admin section.
Go to Appearance => Customize => Additional css and add the following css
```
@media screen and (max-width: 1366px) {
 .wrapper {
  width: 100%;
 }
 #main {
  width:100%;
 }
}
```
Regards,
Tikaram
October 26, 2022 at 9:27 pm #312039

Kattenfotografie.com
Participant

It doesn’t work, nothing changed.

October 26, 2022 at 9:59 pm #312040
Sakin
Keymaster
Hi Ellen,

If you want to make the width of the wrapper bigger on the larger screens then add the following CSS in the “Appearance => Customize => Additional CSS” box:
```
/* Layout to increase the wrapper size */
@media only screen and (min-width: 1281px) {
	.wrapper {
	  width: 1480px;
	  max-width: 100%;
	}
	#main {
		width: calc(100% - 340px);
	}
}
```
October 27, 2022 at 4:21 pm #312050

Kattenfotografie.com
Participant

Do you have another solution for me to try?

October 27, 2022 at 4:29 pm #312051

Kattenfotografie.com
Participant

Sakin, it works! Thank you so much!

October 27, 2022 at 7:46 pm #312052
Sakin
Keymaster
Hi Ellen,

I see that you have extra CSS after the CSS above CSS in your Additional CSS box: You need to remove the following CSS otherwise it will conflict and have issue:
```
/*--------------------------------------------------------------
13. Content
--------------------------------------------------------------*/
#main {
	float: left;
	width: 1200px;
}

.sidebar-primary {
	float: right;
	width: 240px;
}
```
Regards,
Sakin
November 4, 2022 at 12:20 am #312329

Kattenfotografie.com
Participant

Thanks Sakin!

November 5, 2022 at 1:42 am #312345

Sakin
Keymaster

Hi Ellen,

Glad to hear that my support worked on your website. If it’s not too much trouble, I have a quick request: could you please leave an honest review? https://wordpress.org/support/theme/parallax-frame/reviews/#new-post. Your review will help others know what to expect when they’re looking for the support I offer. Even a sentence or two would be hugely appreciated.

Regards,
Sakin
Author

Posts