Smaller border/margin on mobile devices

This topic has 4 replies, 2 voices, and was last updated 8 years, 9 months ago by pips.

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

Author

Posts
January 13, 2016 at 11:18 pm #82818

pips
Participant

Hey sakin,

Can you give me the css code for a smaller margin on mobile devices.

@media only screen and (max-width: 760px) {
/* Code for smaller padding, margin or border
}

Greetings from switzerland (www.lichtundmusik.ch)

Marc

January 14, 2016 at 11:12 am #82851

Mahesh
Participant

Hi @pips,

Can you please clarify on the above with screen shot (if possible). I don’t quite get where you want smaller padding, margin or border. The content doesn’t have any border, margin or padding. The grey color in left and right is the background color and since the content’s width is small it will automatically centered.

Regards,
Mahesh

January 19, 2016 at 7:10 pm #83234

pips
Participant

Hey Mahesh

Thanks for your reply. Iposted the image of my site when looking at it with a smart phone. To better illustrat my problem i draw some blue arrow. This spaces i want to minimize or remove. It is especially about the grey background in the mobile version.

Please have a look at: http://www.lichtundmusik.ch/wp-content/uploads/2016/01/vorübergehend.png

Thanks in advance
Marc

January 20, 2016 at 9:51 am #83294
Mahesh
Participant
Hi @pips,

For the above changes, go to “Dashboard=> Appearance=> Theme Options=> Custom CSS” box and add the following CSS:
```
@media screen and ( max-width: 480px ){
	.site{
		width: 100%;
	}
}
```
Regards,
Mahesh
January 24, 2016 at 12:06 am #83550

pips
Participant

thx it works. 🙂
Author

Posts