Jump to content

Scorptilezero

Members
 View Profile  See their activity

  • Posts

    3

  • Joined

  • Last visited

Scorptilezero's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Scorptilezero
    But is there a reason that when I put overflow:hidden; all my transition and opacity css effect stopped working??
  2. Scorptilezero
    Thx for the help Davej
  3. Scorptilezero
    Hi, I have this homework and I'm stuck because the content of my footer is not showing up inside my footer but under it, and the box of the footer itself is not showing. Thx in advance for the help! <!doctype html> <html> <!--HEAD--> <head> <meta charset="utf-8"> <!--[if lt IE 9]> <script src="//html5shim.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> <title>Pacific Rim (Mon Blogue)</title> <link rel="stylesheet" href="styles.css"> </head> <!--BODY--> <body> <!--MAIN--> <div id="main"> <!--HEADER--> <header> <nav> <ul> <li>À propos</li> <li>Mon blogue</li> <li>Contact</li> </ul> </nav> </header> <!--ASIDE--> <aside> <h2>Mes gouts</h2> <article> <p>Dernièrement j'ai vu le film Pacific Rim. J'ai trouvé le film très intéréssant, l'image était grandiose et le soundtrack était bien choisie. Même si l'histoire de ce film n'est pas extrèmement originale, l'experience m'a vraiment plu.</p> </article> <h2>Liens intéréssants</h2> <article> <nav> <ul> <li><a href="http://www.pacificrimmovie.com/" title="officiel" target="_blank">Site offciel</a></li> <li><a href="http://pacificrim.wikia.com/wiki/Pacific_Rim_Wiki" title="wiki PR" target="_blank">Wiki personalisé</a></li> <li><a href="http://fr.wikipedia.org/wiki/Pacific_Rim" title="wiki officiel" target="_blank">Wikipédia</a></li> </ul> </nav> </article> <article> <!--VIDEO--> <h2>Trailer</h2> <video controls width="320" height="240" loop poster="img/video.jpg"> <source src="video-audio/PacificRim.mp4" type="video/mp4"> <source src="video-audio/PacificRim.ogv" type="video/ogg"> <source src="video-audio/PacificRim.webm" type="video/webm"> Trailer de Pacific Rim. </article> </aside> <!--SECTION--> <section> <h2>Mes articles</h2> <article> <h3>Pacific Rim</h3> <p>Lorsque des légions de créatures monstrueuses, connues sous le nom de Kaiju, ont commencé à s'élever des fonds océaniques, une guerre a éclaté qui prendrait des millions de vies et consommerait les ressources de l'humanité pendant des années. Pour lutter contre le Kaiju géant, un type particulier d'arme a été conçu: des robots massifs, appelé Jaegers, qui sont commandés simultanément par deux pilotes dont les esprits sont enfermés dans un pont neuronal. Mais même les Jaegers les plus puissants et les plus forts se révèlent presque sans défense face au Kaiju implacable. Sur le bord de la défaite, les forces qui défendent l'humanité n'ont pas d'autre choix que de se tourner vers deux héros improbables, un ancien pilote finit et un stagiaire sans expériences qui sont associés pour conduire un Jaeger légendaire mais apparemment obsolète du passé. Ensemble, ils sont le dernier espoir de l'humanité contre l'apocalypse.</p> </article> <article> <h3>Jaeger</h3> <p>Les Jaeger sont un type particulier d'arme mobile créé par le Programme Jaeger. Les Jaeger sont la première et la dernière ligne de défense la plus efficace contre le Kaiju pendant la guerre.</p> </article> <article> <h3>Kaiju</h3> <p>Les Kaiju sont une race de créatures amphibiennes génétiquement crée par une race extra-dimensionnelle d'êtres sensibles de la dimension Anteverse. En 2013, les premiers Kaiju ont ouvert un portail entre les dimensions au fond de l'océan Pacifique, ce qui a permis au Kaiju d'entrer dans notre dimension. Concu comme des armes de guerre biologiques, les Kaiju sont extrêmement hostiles et apparemment conçu avec l'intention d'anéantir l'humanité.</p> </article> </section> <!--FOOTER--> <footer> <!--COLONNE1--> allo <div id="colonne1"> <nav> <ul> <li>À propos</li> <li>Mon blogue</li> <li>Contact</li> </ul> </nav> </div> <!--COLONNE2--> <div id="colonne2"> <!--SOUNDTRACK--> <audio controls> <source src="video-audio/pacificrim.mp3" type="audio/mpeg"> <source src="video-audio/pacificrim.ogg" type="audio/ogg"> <source src="video-audio/pacificrim.wav" type="audio/wav"> Soundtrack de Pacific Rim. </div> </footer> </div> </body> </html> @charset "utf-8"; /* CSS Document */ /* FONT */ @font-face { font-family:'brokendetroit'; src:url('font/Broken Detroit.eot') format('embedded-opentype'),; url('font/Broken Detroit.woff') format('woff'), url('font/Broken Detroit.ttf') format('truetype'), url('font/Broken Detroit.svg') format('svg'); font-weight:normal; font-style:normal; } /* GÉNÉRAL */ body { background:url(img/pacific_rim_title.png) no-repeat fixed center top, url(img/pr.jpg) no-repeat fixed center top; font:normal 1em "brokendetroit",Verdana,Geneva,sans-serif; } article, aside, footer, header, nav, section, {display:block;} /* BODY */ #main { width:955px; margin:auto; border:1px solid #bbb; padding:26px; background:rgba(255,255,255,0.5); box-shadow:0 0 0 16px rgba(255,255,255,0.1) inset, 0 0 0 17px rgba(255,255,255,0.3) inset; -webkit-box-shadow:0 0 0 16px rgba(255,255,255,0.1) inset, 0 0 0 17px rgba(255,255,255,0.3) inset; -moz-box-shadow:0 0 0 16px rgba(255,255,255,0.1) inset, 0 0 0 17px rgba(255,255,255,0.3) inset; border-radius:25px; -webkit-border-radius:25px; -moz-border-radius:25px; margin-top:230px; } /* HEADER */ header nav { width:90%; background:#FFF; margin:auto; text-transform:uppercase; } header nav ul { font:bold 2em "brokendetroit",Verdana,Geneva,sans-serif; color:#000; text-align:center; display:inline; list-style:none; } header nav ul li { float:left; margin:0px 40px; cursor:pointer; -webkit-transition:color 0.6s ease 0.1s,color 0.3s linear 0.1s; -moz-transition:color 0.6s ease 0.1s,color 0.3s linear 0.1s; -o-transition:color 0.6s ease 0.1s,color 0.3s linear 0.1s; transition:color 0.6s ease 0.1s,color 0.3s linear 0.1s; -webkit-transition:text-shadow 0.6s ease 0.1s,color 0.3s linear 0.1s; -moz-transition:text-shadow 0.6s ease 0.1s,color 0.3s linear 0.1s; -o-transition:text-shadow 0.6s ease 0.1s,color 0.3s linear 0.1s; transition:text-shadow 0.6s ease 0.1s,color 0.3s linear 0.1s; } header nav ul li:hover { color:#ad8853; text-shadow:2px 3px 0px rgba(0,0,0,0.8), -2px -3px 0px rgba(0,0,0,0.8); } /* TITRE H */ h2 { font:bold 2em "brokendetroit",Verdana,Geneva,sans-serif; color:#ad8853; text-shadow:2px 3px 0px rgba(0,0,0,0.8), -2px -3px 0px rgba(0,0,0,0.8); text-transform:capitalize; text-align:center; margin-top:40px; } h3 { font:bold 1.5em "brokendetroit",Verdana,Geneva,sans-serif; color:#ad8853; text-transform:capitalize; text-align:center; } /* ASIDE */ aside { clear:both; float:none; width:40%; float:left; } aside article p { color:#FFF; background:#000; margin:0px auto 10px; border:1px solid #f00; opacity:0.6; filter:alpha(opacity=60); padding:10px; } aside article p:hover { opacity:1.0; filter:alpha(opacity=100); } aside article { width:90%; margin:0px auto 10px; } aside article nav { font:normal 1.2em Verdana, Geneva, sans-serif; width:70%; padding:20px; text-align:center; } aside article nav ul { display:block; list-style-type:none; margin:auto; } aside article nav a {text-decoration:none;} aside article nav a:link {color:#000;} aside article nav a:visited {color:#000;} aside article nav a:hover {color:#00F;} aside article nav a:active {color:#00F;} aside article nav ul li { float:none; margin:0px 0px; cursor:pointer; } aside article video { cursor:pointer; padding:0px; margin:0px; height:181px; } /* SECTION */ section { width:60%; float:right; } section article { width:90%; background:#000; margin:0px auto 10px; border:1px solid #f00; opacity:0.6; filter:alpha(opacity=60); } section article:hover { opacity:1.0; filter:alpha(opacity=100); } section article p { margin:10px; color:#fff; } /* FOOTER */ footer { clear:both; background:url(img/footer.png) no-repeat scroll center top; border:1px solid #000; width:810; height:270; margin:auto; position: relative; } #colonne1 { display:block; width:39%; float:left; position:relative; } footer nav ul { text-align:left; list-style:none; } #colonne2 { display:block; width:59%; float:right; position:relative; } footer audio { cursor:pointer; margin:0px; padding:0px; } Charles monblogue.htm styles.css
×
×
  • Create New...