综合开发

CSS centering on desktop but not mobile

微信扫一扫,分享到朋友圈

CSS centering on desktop but not mobile

I have been hunting around and haven’t found a solution that works yet.

Here is my site which does what is needed on a desktop but when it loads in mobile the upper icons are no longer centered but the lower ones are

To supply all the code here would be long so I’m sure someone will knock me for that but to me it seems easy to use the inspector since i’m not sure if css else where could be effecting this.
I will gladly paste all of the code here if really needed.

As you can see on the desktop they are in a row but on a mobile I would like to have them centered and 2 in a row on portrait and all in a line on landscape but still be centered in the screen.

My Site Desktop

My Site in an iPhone 5 view

Problem courtesy of: Tsukasa

Solution

Within your div .centermiddle
you have divs named .view
that have the style float: left;

Instead of floating your elements you should set them as display: inline-block;
which is the correct way of achieving what you want to do.

Doing so will center those buttons for you.

Solution courtesy of: chdltest

微信扫一扫,分享到朋友圈

CSS centering on desktop but not mobile

Implementing a Language for Distributed Systems: Choices and Experiences with Type Level an...

上一篇

Change the DIV background image to .hover - with fade

下一篇

你也可能喜欢

评论已经被关闭。

插入图片

热门栏目

CSS centering on desktop but not mobile

长按储存图像,分享给朋友