Salve a tutti, sto realizzando un sito così per dei miei amici e per esercitarmi un po' con l'html e i css. Praticamente in quest sito ci sono diverse pagine, simili alla schermata iniziale di google che quindi permettono di cercare sul motore di ricerca, ma al posto della scritta "Google" c'è scrtto il nome di una persona.
Nella realizzazione di questo sito ho avuto due problemi:
Il primo primo problema è questo, per permetere di cercare su google ho usato questo form, ma poi il sito viene considerato sito di phishing, potere aiutarmi a risolvere?
Questo è il form:
codice:
 <form method="get" action="http://www.google.it/search"> 
          <table bgcolor="#ffffff"> 
            <tbody><tr><td><input style="FONT-SIZE: 20px" maxlength="255" size="31" name="q"><input type="hidden" name="hl" value="it"><input value="Cerca" type="submit" name="btnG"></td></tr></tbody> 
          </table> 
        </form>
Il secondo problema si è presentato quando stavo facendo la versione mobile, a parole non so spiegarlo, vi lascio qui il link http://iosapk98.altervista.org/prova-mobile.html
Quest'errore si verifica solo se visualizzato da cellulare, non dal pc. Vi sarei grato se mi aiutaste a risolverlo, Grazie.
questo è il codice html:
codice:
<!DOCTYPE html>
<html>
<head>
<title>Versione Mobile</title>
<meta name = "viewport" content = "width = device-width, user-scalable = no">
</head>
<body>

<input type="checkbox" name="nav" id="nav">
<div id="page">
  <script type="text/javascript">
<!--
function confirmation() {
	var answer = confirm("Stai per lasciare la versione mobile di GoogleMod")
	if (answer){
		window.location = "versione_desktop";
	}
	else{
		return false;
	}
//-->
</script>
<header>
  <label id="navbuttontop" for="nav">
  <h6>[img]img/trig.png[/img]</h6>
  </label>
  <h1>[img]img/bar_logo.png[/img]</h1>
</header>
<label id="contentsideoverlay" for="nav"></label>
<nav>
  <ul>[*] [img]immagine[/img]<font color="#FF0000">Home</font> [/list]
  <div class="separator2">Favoriti</div>
  <ul>[*][img]immagine[/img] ...[*][img]immagine[/img] ...[*][img]immagine[/img] ...[/list]
  <div class="separator">Canali</div>
  <ul>[*][img]immagine[/img] ...[*][img]immagine[/img] <font color="#FF0000">...</font>[*][img]immagine[/img] ...[*][img]immagine[/img] ...[*][img]immagine[/img] ...[*]<button onclick="confirmation()" class="switch" type="button">[img]immagine[/img] Vers. Desktop</button>[*]
    Copyright
    [/list]
</nav>
<div id="content">


      </div>
</body>
</html>
e questo è il codice css:
codice:
body {
background-color: #ffffff
	padding: 0;
	margin: 0;
	background:#333;
	font-family:Helvetica, sans-serif;
	font-size:12px;
	line-height:18px;
	font-weight:regular;
	letter-spacing:0px;
	
}
div {
	padding: 0;
	margin: 0;
}
input[type='checkbox'] {
	display: none !important;
	visibility: hidden;
}
label {
	cursor: pointer;
}
/*==|== Layout ================================================ */
#page {
	/* None of this may be needed */
  	position: relative;
	width: 100%;
	height: 100%;
}
header {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	height: 48px;
	position: fixed;
}
header h1 {
	margin: auto 0;
}
/* Toggle button */
label#navbuttontop {
	padding: 0;
	margin:11px 13px;
	float: left;
	border:0px;
	/* This causes us to have to move one less thing when :checked, but pushes the header to the right and brings it off of center */
  width: 24px;
	height: 21px;
}
label#navbuttontop h6 {
	margin: auto 0;
}
/* An invisible label that allows the user to return to the page by clicking anywhere outside of the navigational menu */
label#contentsideoverlay {
	position: fixed;
	left: 60%;
	top: 0;
	width: 40%;
	height: 100%;
}
/* Content area */
#content {
	position: fixed;
	overflow-x:hidden;
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	padding-top: 48px;
	height: 100%;
	width: 100%;
	z-index: -1;
}
#content img {
	width: 100%;
}
nav {
	position: fixed;
	overflow: hidden;
	width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	background-color: #4e4e4e;
}
nav ul {
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 0;
	list-style: none;
	background-color: #2b77f4;
	-moz-box-shadow:          inset -4px -0px 8px rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: inset -4px -0px 8px rgba(0, 0, 0, 0.2);
	box-shadow:         inset -4px -0px 8px rgba(0, 0, 0, 0.2);
}
nav ul li:first-child {
	border-top: 0;
}
nav ul li:last-child {
	border-bottom: 0;
}
nav li:focus, nav li:active {
	background-color: #8ab6ff;
}
nav li {
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 3%;
	list-style: none;
	min-height:43px;
	border-bottom: 1px solid #1e1e1e;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	font-size: 16px;
	line-height:43px;
	font-weight:bold;
	color: #eeeeee;
	text-shadow: 0 1px 0 #000000;
	
}
nav a, nav a:link, nav a:hover, nav a:visited {
	text-decoration: none;
	color: #fff;
	text-shadow: 0 1px 0 black;
	text-decoration: none;
	display: block;
	float: left;
	margin: 0;
	width: 95%;
}
nav .separator2 {
	background: #999999;
	background: -webkit-gradient( linear, left top, left bottom, from(#444444), to(#555555) );
	background: -moz-linear-gradient(top, #444444 0%, #555555 100%);
	border-bottom: 1px solid #242A37;
	border-top: 1 px solid #000;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	color: #eeeeee;
	padding: 4px 0 4px 8px;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .6);
	font-size: 10px;
	line-height:1px;
	text-transform: uppercase;
	height:12px;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 12px;
}
nav .separator {
	background: #999999;
	background: -webkit-gradient( linear, left top, left bottom, from(#444444), to(#555555) );
	background: -moz-linear-gradient(top, #444444 0%, #555555 100%);
	border-bottom: 1px solid #242A37;
	border-top: 1 px solid #000;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
	color: #eeeeee;
	padding: 4px 0 4px 8px;
	text-shadow: 0 1px 0 rgba(0, 0, 0, .6);
	font-size: 10px;
	line-height:1px;
	text-transform: uppercase;
	height:12px;
	float: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
	margin: 0;
	padding: 12px;
}
/*==|== Appearance ============================================ */
header {
	background: -webkit-gradient( linear, left top, left bottom, from(#27be2a), to(#007003) );
	background: -moz-linear-gradient(top, #FA761E 0%, #CD4E24 100%);
	border-color: #4F1E0E;
	box-shadow: inset 0 1px 0px 0px rgba(255, 255, 255, 0.6), 0 1px 5px rgba(0, 0, 0, .9);
	-webkit-box-shadow: inset 0 1px 0px 0px rgba(255, 255, 255, 0.6), 0 1px 5px rgba(0, 0, 0, .9);
	text-align:center;
}
header h1 {
	/* Change with $barheight */
    color: #fff;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
	margin:3px 0px 0px 0px;
	padding:0px 50px 0px 0px;
	text-align: ;
}
label#navbuttontop {
	text-align: center;
}
label#navbuttontop h6 {
	/* Change with $navlabelheight */
    color: #fff;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
}
label#contentsideoverlay {
	visibility: hidden;
	opacity: 0;
	z-index: 2000;
}
#content {
	background-color: #333;
}
/* Transitions */
header, nav, #content, #gallery_content, #forum_content {
	-webkit-transition-duration: 0.0s;
	-moz-transition-duration: 0.0s;
	-o-transition-duration: 0.0s;
	transition-duration: 0.0s;
}
/* Transitions */


/*==|== Sidebar Method Implementation ========================= */
/* All must be moved separately because of the fixed positioning */
input[id=nav]:checked + div#page div#content, input[id=nav]:checked + div#page header, input[id=nav]:checked + div#gallery_content div#thumbs-toolbar-top, input[id=nav]:checked + div#gallery_content div#gallery_adv, input[id=nav]:checked + div#gallery_content div#thumbs-container, input[id=nav]:checked + div#gallery_content div#thumbs-footer, input[id=nav]:checked + div#forum_content div#page-header, input[id=nav]:checked + div#forum_content div#page-body, input[id=nav]:checked + div#forum_content div#page-footer {
	position: relative !important;
	left: 60%;
	overflow: hidden;
}
input[id=nav]:checked + div#page nav, input[id=nav]:checked + div#gallery_content nav {
	width: 60%;
	overflow-x:hidden;
	overflow-y:scroll;
	-webkit-overflow-scrolling: touch;
}
input[id=nav]:checked + div#page label#contentsideoverlay, input[id=nav]:checked + div#gallery_content label#contentsideoverlay {
	visibility: visible;
}
#content {
	background-color: #ffffff
}
.switch {
   background-color: rgba(18,127,210,1);
   background-image: -webkit-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
   background-image:    -moz-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
   background-image:     -ms-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
   background-image:      -o-linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
   background-image:         linear-gradient(top, rgba(54,168,234,1) 0%,rgba(18,127,210,1) 100%);
   -webkit-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
      -moz-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
           box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 1px 0px 0px 0px rgba(255,255,255,0.4)inset, -1px 0px 0px 0px rgba(255,255,255,0.4)inset;
   border: solid 1px rgba(3,94,163,1);
   -webkit-border-radius: 6px;
      -moz-border-radius: 6px;
           border-radius: 6px;
   width: 210px;
   display: inline-block;
   font-size: 16px;
   line-height: 40px;
   text-align: center;
   color: rgba(255,255,255,1);
   text-shadow: 0px 1px 1px rgba(0,0,0,0.33)
}
.switch:hover {
   background-image: -webkit-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
   background-image:    -moz-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
   background-image:     -ms-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
   background-image:      -o-linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
   background-image:         linear-gradient(top, rgba(47,144,213,1) 0%,rgba(3,81,183,1) 100%);
   -webkit-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
      -moz-box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
           box-shadow: 0px 1px 0px 0px rgba(255,255,255,0.4)inset, 0px -1px 0px 0px rgba(255,255,255,0.2)inset;
   border: solid 1px rgba(0,52,129,1);
}
.switch:active {
   background-image: none;
   -webkit-box-shadow: 0px 0px 8px 2px rgba(0,61,127,0.4)inset, 0px 0px 2px 2px rgba(0,60,125,0.2)inset;
      -moz-box-shadow: 0px 0px 8px 2px rgba(0,61,127,0.4)inset, 0px 0px 2px 2px rgba(0,60,125,0.2)inset;
           box-shadow: 0px 0px 8px 2px rgba(0,61,127,0.4)inset, 0px 0px 2px 2px rgba(0,60,125,0.2)inset;
   border: solid 1px rgba(0,70,131,1);
}
}