Responsive Website Pixels- Don't Understand

patrickzeis · Member · Mar 9, 2016 at 11:24 pm
Copy link

Add topic to favorites
Hello all,

I am trying to add some responsive touches to a website and really don’t understand pixels. I want to remove a slider under the size of an iPad (9.7 inches)- the iPad also wouldn’t have the slider. I also want to use a different website banner/logo for devices under the size of an iPad mini (7.9 inches)- the iPad mini would use the larger banner.

I am confused because pixels represent size, yet the iPad mini and older iPad have the same pixel size? I am not sure that I understand how this is possible?

What are the pixel measurements that I need to use here? I am having someone make these changes and I need to know the pixels I want to use. Any help is appreciated.

The blog I need help with is: (visible only to logged in users)
carladoria · Member · Mar 10, 2016 at 4:51 pm
Copy link
Hi there,
Probably the following link will help you understand better how responsive sites work: https://en.support.wordpress.com/custom-design/custom-css-media-queries/
CSS styling can be used with these media queries so that your site accommodates to the size of screen.
If you use this one for example:
```
@media screen and (max-width: 800px) {
    #site-header {
        display: none;
    }
}
```
It will usually target all small devices with a maximum size of 800 px and any header you specify here will only be applied to those devices.
Check up this site for more information about different iPads pixels and dismensions: http://www.websitedimensions.com/
patrickzeis · Member · Mar 10, 2016 at 7:18 pm
Copy link
CarlaDoria,

Thank you so much for your help. This is exactly what I needed.
thesacredpath · Member · Mar 14, 2016 at 7:07 pm
Copy link
Hi @patrickzeis, it looks like you are using WordPress but you are not hosted here at WordPress.com. In the future, for self-hosted WordPress sites such as yours, I would suggest asking for help from the theme author directly or ask in the volunteer-based WordPress.org Themes and Templates forum.

For general questions on self-hosted WordPress.org installations, visit http://wordpress.org/support/.

The differences between WordPress.com and WordPress.org.

No items found.