Votes given by phoebe'

  1. view post Posted: 7/10/2013, 18:15 by: radiøactive.     -1
    menù #01 - † css & html
    .
    menù top forum #01

    zsrGUGi

    live preview - - - here
    - - - se prendete, comunicate qui


    COSA POTETE MODIFICARE

    ° logo e gif, ed immagini sottostanti la gif;

    ° i colori di scritte e link

    COSA NON POTETE MODIFICARE

    ° la disposizioni di link, scritte ed immagini: il menù ha la sua struttura e non è una base per un vostro menù completamente differente;

    ° rimuovere i credits sotto alla descrizione.

    INFO

    ° la gif è 206*117;

    ° le immagini rappresentano i siti: twitter, tumblr, 8tracks, livejournal e blogger;

    ° se superate lo spazio che vedete occupato dalle parole "desc" il menù perderà la sua armonia grafica;

    ° i link non possono essere più di 9;

    ° il logo non può superare i 330px di altezza.


    CSS

    CODICE
    /*SIDEBAR BY RADIOACTIVE */

    #sidebar {position: fixed; width: 100%; margin-top: -5px; background-color: #4A4747; height: 350px; border-bottom: 30px solid #626161}

    #gif {margin-top: 1%; margin-left: -80%; opacity: 0.7}

    #gif:hover {opacity: 1}

    #imglink1 {margin-left: -93%; margin-top: 5px}
    #imglink2 {margin-left: -88%; margin-top: -22px}
    #imglink3 {margin-left: -80%; margin-top: -22px}
    #imglink4 {margin-left: -73%; margin-top: -20px}
    #imglink5 {margin-left: -67%; margin-top: -20px}

    #desc {font-family: georgia; font-size: 9px; color: #999; margin-left: 30px; text-align: justify; width: 200px}

    #link1 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: -320px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link2 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 10px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link3 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link4 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link5 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link6 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link7 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link8 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link9 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}


    #link10 {line-height: 15px; background-color: #530000; width: 180px; height: 20px; margin-left: 260px; margin-top: 13px; font-family: georgia; font-size: 12px; color: #999; text-align:justify; padding-left: 5px; padding-top: 2px}

    #link1:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link2:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link3:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link4:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link5:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link6:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link7:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link8:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}
    #link9:hover {background: #626161; font-style: italic; border-left: 10px solid #530000}

    #logo {margin-top: -305px; margin-left: 470px}


    HTML

    CODICE
    <!--SIDEBAR BY RADIOACTIVE-->
    <div id="sidebar">

    <div id="gif"> <img src="http://i.imgur.com/JwNkcyx.gif" /></div>


    <div id="imglink1" title="twitter"><a href="http://"><img src="http://i.imgur.com/zUxW8Wd.png" /></a></div>
    <div id="imglink2" title="tumblr"><a href="http://"><img src="http://i.imgur.com/puB7HZn.png" /></a></div>
    <div id="imglink3" title="8tracks"><a href="http://"><img src="http://i.imgur.com/kcPX6cV.png" /></a></div>
    <div id="imglink4" title="livejournal"><a href="http://"><img src="http://i.imgur.com/zGeN7sW.png" /></a></div>
    <div id="imglink5" title="blogger"><a href="http://"><img src="http://i.imgur.com/TSaqqsB.png" /></a></div>

    <div id="desc">desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc desc<br>

    <div align=center> sidebar under copyright; © <a href="http://fairyblood.blogfree.net/?act=Profile&MID=181500" />radiøactive.</a> </div></div>


    <div id="link1"><a href="http://">link1</a></div>
    <div id="link2"><a href="http://">link2</a></div>
    <div id="link3"><a href="http://">link3</a></div>
    <div id="link4"><a href="http://">link4</a></div>
    <div id="link5"><a href="http://">link5</a></div>
    <div id="link6"><a href="http://">link6</a></div>
    <div id="link7"><a href="http://">link7</a></div>
    <div id="link8"><a href="http://">link8</a></div>
    <div id="link9"><a href="http://">link9</a></div>



    <div id="logo"><a href="http://"><img src="http://i.imgur.com/bWHjHoB.gif?2931"/></a></div>
    </div>
1 replies since 19/11/2010
Filter forums
.
Top
Create your blog! · Create your forum! · Top Blog · Categories · Help · Status · Contacts · Powered by BlogFree
Top