My wordpress theme (Tesseract) and the PageBuilder plugin I have installed conflict with one another forcing me to do my own CSS coding. After toying around with CSS and the inspect element tool on chrome, I fixed the responsiveness (not really fixed, more like hacked I guess..) of my website thevandreasproject.com. I used this code to make it work on the iPhone 5 screen:
@media (min-width: 680px) {
.home-background .textwidget {
font-size: 50px;
font-style: normal;
font-weight: 500;
letter-spacing: 8px;
font-family: 'Roboto';
min-height: 880px;
padding-top: 20px;
}
}
@media (max-width: 679px) {
.home-background .textwidget {
padding-top: 20px;
padding-bottom: 175px;
font-style: normal;
font-weight: 500;
font-family: 'Roboto';
}
.site-content {
height: 0!important;
}
#footer-banner {
padding:50px;
}
}I was wondering if there was another way to rescale the text and images using CSS Editor to make my website responsive. I don’t want to use media-queries for every device there is to rescale properly. I appreciate it!