i am quite new in ionic2 and i still confusing in few things about this framework, one of the biggest confusion of me is what is the good way to set css attribute?
for example if i set the image height to be 80px which is suitable for my phone resolution but the result is different on other phone…same goes to margin padding and most of the item. do i need to set everything in percentage format so the app will be behave same on all device?
I think this question is more about responsive design, than a question about Ionic Framework specifically.
Have a look at http://www.w3schools.com/css/css_rwd_images.asp
thanks…will look into it now…may i know how you handle this case in ionic2 app?
It really depends on the case. I don’t use images bigger than what I need and most of the time I use images as background as they’re easier to manipulate.
I only use img tag inside ion-avatar, ion-card, or ion-slide.
The rest of the time I prefer using images as background, and I set the background-size property to cover to make sure that it’s set at the perfect size.
ya i got it now…not only image…i think set any element width height by pixel like 50px is a bad idea in ionic2?
i will try and study responsive design now…thanks for helping
1 Like
Yeah generally using pixels for width/height is a bad idea but not all the time. For example, modifying the navbar height and setting it manually to preferred px value wouldn’t be a bad idea. But setting it’s width to px would be a bad idea. Because on a larger device, the navbar will not fill the whole screen.
Try to stick to % whenever possible.
for this example…i am trying to do the left contact list for my chat app…i try to align the “ion-avatar” and 2 “p” or “label” in center of the square…and now im kind of stuck in this situation, i try to adjust the css so much but still not the result i wanted…do you have any idea how to do this?
i think i figured it out already by trying to use div and a lot of css…thanks for your help for giving me a lot of hints and tips…