[Need Some HELP] My HTML website to responsive mobile website using only CSS/Viewport

francis1017

Failed to resolve a dispute resolution thread.
Joined
Feb 26, 2013
Messages
2,225
Reaction score
572
Hello Everyone!

As the title says, I am really needing some help on my html single page websites.
I paid someone on fiverr who can edit my site so it can pass the google mobile friendly checker and he did it.
So I checked the codes that he added, a viewport and some codes on css.
Used it on my other sites some worked in those sites that has same designs and won't work (from different designs).
Though I tried my best to make it work but I can't. And I am broke right now so I can't pay someone :(

Here are the codes:

In the head section of the index.html:
Code:
<meta name="viewport" content="width=device-width, initial-scale=1">

The codes that he added in the CSS:
Code:
@media (min-width: 320px ) and (max-width: 359px)
{
    #head {
    background: url("img/head.png") no-repeat scroll center top / contain rgba(0, 0, 0, 0);
    height: 54px;
}
#content {
    padding: 0px !important;
    width: 100%;
}
}
@media (min-width: 360px ) and (max-width: 479px)
{
    #head {
    background: url("img/head.png") no-repeat scroll center top / contain rgba(0, 0, 0, 0);
    height: 61px;
}
}
@media (min-width: 480px ) and (max-width: 639px)
{
    
#head {
    background: url("img/head.png") no-repeat scroll center top / 100% auto rgba(0, 0, 0, 0);
    height: 81px;
}
}
@media (min-width: 640px ) and (max-width: 767px)
{
    
#head {
    background: url("img/head.png") no-repeat scroll center top / 100% auto rgba(0, 0, 0, 0);
    height: 108px;
}
}
@media (min-width: 768px ) and (max-width: 799px)
{
    #head {
    background: url("img/head.png") no-repeat scroll center top / 100% auto rgba(0, 0, 0, 0);
    height: 130px;
}
}
@media (min-width: 800px ) and (max-width: 919px)
{
    #head {
    background: url("img/head.png") no-repeat scroll center top / 100% auto rgba(0, 0, 0, 0);
    height: 135px;
}
}

@media (min-width: 320px) and (max-width: 800px)
{
    #content {
    padding: 0px !important;
    width: 100%;
}
#content img {
    height: auto;
    max-width: 100%;
}
ul.enlarge span {
    display: none !important;
}
#content iframe {
    width: 100% !important;
}
.container {
    width: 100% !important;
}
}

I can understand a little of CSS and html codes.
Please please please I need some help.
Please PM me if someone wants to help. I'll give you my cpanel account info or anything you want.

Thank you!
 
Can someone please help me :(
 
It might would be helpful if you also post the URL to your website, then the people that are open to help you can check it out :)
 
are you matching the code he gave you(CSS). To each new sites HTML? if your just copy pasting that's probably why.
 
Back
Top