Salve. Sto creando un sito basandomi su un template quasi vuoto.
Ho un problema, ho aggiunto un menù fixed alla pagina html . (HTML E CSS , Nessun jquery)
Solamente che un pulsante è attacato ad un altro. Come Posso risolvere? Ho provato con i margin ma niente.
Inoltre c'è anche un altro problema credo che le dimensioni degli elementi e della pagina siano sbagliate , potete aiutarmi anche in quest ultimo problema?? Grazie.
1074353577.jpg
CSS:
codice:.fleft {float:left}.fright {float:right} .fclear {clear:both} .fcenter {float:none;text-align:center} body {background-color:#000;margin:0;padding:0;font-family:Arial, Helvetica, sans-serif;font-size:14px;color:#fff} a {color:#d7440b} #menu ul {list-style:none;margin:0;padding:0} #menu ul li {padding:0;margin-left:10px;margin-top:15px;width:95px;float:left} #wrapper {width:960px;margin:0 auto;background:url(images/background.jpg) top left no-repeat} #menu {width:662px;height:71px;margin-left:148px;margin-top:10px;position: relative} #banner {background:url(images/header-img.jpg) top center no-repeat;width:960px;height:282px} #logo {margin-left:60px;padding-top:120px} #content-box {width:860px;height:700px;background:url(images/black-bg.png) top left repeat-x;margin-left:30px;padding:20px;margin-top:30px} .welcome {float:left;clear:none;width:255px} #news {float:left;clear:none;width:255px} #event {float:left;clear:none;width:255px} .divider {float:left;clear:none;border-left:1px solid #942a01;height:340px;margin-left:20px;margin-right:20px} .title {font-size:20px;color:#d7440b;margin-bottom:15px} .more-btn {text-align:right;margin-top:10px} .sub-title {color:#d7440b;font-size:16px;text-decoration:underline} .inner_copy {border:0;color:#f00;float:left;width:50% !important;margin:-100% 0 0 0;overflow:hidden;line-height:0;padding:0;font-size:11px} #h-divider {border-top:1px solid #942a01;margin-top:20px;margin-bottom:20px} #newsletter {background:#d7440b;width:246px} #newsletter-top {background:url(images/newsletter-top.png) top left no-repeat;width:231px;height:23px;padding-left:15px;font-size:13px;padding-top:3px} #signup-box input {background:#000;margin-left:15px;margin-top:15px;width:210px;height:25px;border:#000} #unsubcribe {float:left;clear:none;padding-top:15px;margin-left:15px} #unsubcribe a {color:#000;font-weight:bold;font-size:13px} #subcribe-btn {float:right;clear:none;margin-right:15px;margin-top:10px;margin-bottom:15px} #footer {font-size:11px;margin-top:30px;padding-bottom:10px} #footer div {padding:0 15px} .content-box1 {width:960px;margin-left: -40px;margin-right: auto;margin-top:380px;background: #000 top left no-repeat} .title1 {font-size:20px;color:#ffffff;margin-bottom:15px;margin-left:20px} .text {font-size:12px;color:#ffffff;margin-bottom:15px;margin-left:20px;font-style:italic} .divider1 {border: 0;margin-bottom:25px;margin-top:460px;height: 1px;background: #333;background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc); background-image: -moz-linear-gradient(left, #ccc, #333, #ccc); background-image: -ms-linear-gradient(left, #ccc, #333, #ccc); background-image: -o-linear-gradient(left, #ccc, #333, #ccc)} .orange.button { -webkit-animation-name: orangePulse; -webkit-animation-duration: 3s;-webkit-animation-iteration-count : infinite;color:white;text-decoration: none;position: fixed} @-webkit-keyframes orangePulse { from { background-color: #d45500; -webkit-box-shadow: 0 0 9px #333; } 50% { background-color: #ff5c00; -webkit-box-shadow: 0 0 18px #ff5c00; } to { background-color: #d45500; -webkit-box-shadow: 0 0 9px #333; } } .button { margin-right: 0.5em; border-radius: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; display: inline-block-webkit-box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset; box-shadow: 0 1px 0 rgba(255,255,255,0.5) inset; -webkit-transition: background-color 300ms ease-out; -moz-transition: background-color 300ms ease-out; transition: background-color 300ms ease-out; border-style:solid; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-width: 0; border-top-width: 0px; text-align: center; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; cursor:pointer; font-family: inherit; font-weight: bold; line-height: normal; margin-bottom: 1.25em; margin-left: 15px; text-decoration: none; margin-left: 5px; text-align: center; display: inline-block; padding-top: 0.65em; padding-right: 1.5em; padding-bottom: 0.80em; padding-left: 1.5em; font-size: 15px; background-color: #2daebf; border-color: #238896; color: white; }
HTML:
codice:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Athletic Kick Boxing - Salerno</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="shortcut icon" href="images/favicon.ico"> <meta name="viewport" content="width=device-width"> <meta name="author" content="Athletic Kick Boxing Salerno"/> <meta name="description" content="A differenza delle classiche discipline di combattimento l'Athletic Kick Boxing, ha la prerogativa di soddisfare le esigenze dell'inesperto, dell'amatore, o dell'agonista degli sport da combattimento. Ciò è dovuto alla varietà tecnica insita nell'addestramento del maestro del Team, che a vantaggio di altri,si confronta su tre differenti azioni tattiche."/> <meta name="keywords" content="Kick Boxing Salerno, Kick Box Salerno, Difesa Salerno, Boxing Salerno, Athletic Kick Boxing Salerno, Kick Boxing Salerno Athletic"> <link href="style.css" media="screen" rel="stylesheet"/> </head> <body> <div id="wrapper"> <!-- menu --> <div id="menu"> <ul> <!-- <li><a href="#">Home</a></li> <li><a href="#">Chi Siamo</a></li> <li><a href="#">Eventi</a></li> <li><a href="#">Orari</a></li> <li><a href="#">Video</a></li> <li><a href="#">Contatti</a></li> --> <li><a class="orange button" href="#">Home</a></li> <li><a class="orange button" href="#">Chi Siamo</a></li> <li><a class="orange button" href="#">Eventi</a></li> <li><a class="orange button" href="#">Orari</a></li> <li><a class="orange button" href="#">Video</a></li> <li><a class="orange button" href="#">Contatti</a></li> </ul> </div> <!-- banner --> <div id="banner"> <div id="logo"><img alt="" src="images/logo.png"/></div> </div> <!-- content --> <div id="content-box"> <div class="inner_copy"></div> <!-- welcome --> <div class="welcome"> <div class="title"><b>Benvenuto</b></div> <div> Benvenuto nel sito Athletic Kick Boxing Salerno. Puoi chiederci qualsiasi informazione attraverso la pagina contatti. <p></p> <img src="images/lwelcome.png" width="150" height="150" style="margin-left:50px"> </div> </div> <div class="divider"></div> <!-- news --> <div id="news"> <div class="title"><b>News</b></div> <div class="sub-title" style="text-decoration:none">--</div> <div> Qualsiasi notizia verrà postata sulla pagina facebook. <a href="https://www.facebook.com/Athletic.kick.boxing?ref=ts&fref=ts">Pagina Facebook </a> </div> <div class="sub-title" style="margin-top:15px;text-decoration:none;">--</div> <div> Al momento nessuna notizia </div> </div> <div class="divider"></div> <!-- Featured Event --> <div id="event"> <div class="title"><b>Orari</b></div> <div class="sub-title" style="text-decoration:none">Lunedì - Mercoledì - Venerdì</div> <div> <p> </p> <p> </p> Dalle 20:30 alle 22:30 </div> <div id="h-divider"></div> </div> <div class="content-box1"> <div class="divider1"> </div> <div class="title1"><b>La Kick Boxing</b></div> <p> <div class="text"> A differenza delle classiche discipline di combattimento l'Athletic Kick Boxing, ha la prerogativa di soddisfare le esigenze dell'inesperto, dell'amatore, o dell'agonista degli sport da combattimento. Ciò è dovuto alla varietà tecnica insita nell'addestramento del maestro del Team, che a vantaggio di altri,si confronta su tre differenti azioni tattiche. Rilegando ampio spazio al lavoro di gambe e braccia, nel progamma l'Athletic Kick Boxing aggiunge anche tecniche di difesa personale, molto utile per acquisire sicurezza e controllo nelle svariate situazioni quotidiane.Il Team privilegia il settore agonistico e non esclude la possibilità conoscitiva a coloro i quali interessa la parte concentrata all'addestramento tecnico ed alla forma fisica. Il programma d'insegnamento prevede un ampio raggio di proposte, fra le quali il lavoro di gambe, le tecniche di braccia, il condizionamento ritmico ed agonistico, lo sparring (lavoro tecnico a due), l'addestramento ai sacchi e colpitori, e può essere approfondito a richiesta, per la formazione nell'ambito del settore agonistico o di istruttore tecnico. Coinvolgente per la preparazione fisica, è diventato negli ultimi anni un'attraente attività sportiva per donne e uomini di ogni età. Il concetto innovativo dell'allenamento e l'addestramento tecnico sono le peculiarità che rendono la kick Boxe condotta dall'Athletic Kick Boxing la disciplina di lotta più completa ed accattivante. </div> </p> </div> </div> <div style="clear:both;"></div> <!-- footer --> <div id="footer"> <div class="fleft"><p>Tutti i Diritti Riservati.</p></div> <div class="fcenter"> <br/> <br/> <p>Template Designed By: <a href="http://www.mytemplatebox.com/">TemplateBox</a></p> <p>Modified By: <a href="https://www.facebook.com/Athletic.kick.boxing?fref=ts" target="_blank">Athletic Kick Boxing - Salerno</a></p> </div> </div> </div> </div> </body> </html>
Rispondi quotando
