Visualizzazione risultati 1 fino 1 di 1

Discussione: [CSS] Allineare a destra il form di ricerca [era:Aiuto con css]

  1. #1
    Guest

    Predefinito [CSS] Allineare a destra il form di ricerca [era:Aiuto con css]

    Salve, questa è una parte del mio codice:

    Codice PHP:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
    >

    <
    html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <
    head>
    <
    meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <
    title>Viaggi & Miraggi</title>
    <
    link rel="stylesheet" href="style.css" type="text/css" charset="utf-8" />
    <
    style type="text/css">
    <!--
    .
    h8 {
    text-align: right;
    font-size: 18px;
    font-family: Verdana, Geneva, sans-serif;
    color: #990000;
    }
    -->
    </
    style>
    </
    head>

    <
    body>
    <
    div id="wrapper">
    <
    div id="left">
    <
    h1>Viaggi & Miraggi</h1>
    <
    div id="copyright">
    <
    p>Copyright 2010.</p>
    <
    p>Tutti i diritti riservati.</p>
    </
    div>
    </
    div>
    <
    div id="right">
    <
    div id="nav">
    <
    ul>
    <
    li class="selected"><a href="index.php">Home</a></li>
    <
    li><a href="index.php?view=articoli">Articoli</a></li>
    <
    li><a href="index.php?view=foto">Fotografie</a></li>
    <
    li><a href="index.php?view=diari">Diari</a></li>
    <
    li><a href="index.php?view=viaggi&miraggi">Viaggi & Miraggi</a></li>
    <
    li><a href="index.php?view=destinazioni">Destinazioni</a></li>
    <
    li class="last"><a href="segnalazioni">Le vostre segnalazioni</a></li>
    </
    ul>
    </
    div>
    <
    div id="subnav">
    <
    ul>
    <
    li class="selected"><a href="index.php">Home</a></li>
    <
    li><a href="index.php?view=articoli">Articoli</a></li>
    <
    li><a href="index.php?view=foto">Fotografie</a></li>
    <
    li><a href="index.php?view=diari">Diari</a></li>
    <
    form method="POST" action="index.php?view=risultati"></cerca>
    <
    input name="key" type="text">
    <
    input type="submit" value="Cerca">
    </
    form>
    </
    ul>
    </
    div>

    E questo è il mio file css:


    Codice PHP:
    html, body, h1, h2, h3, h4 {
    margin: 0;
    padding: 0;
    }
    h1 img {
    display: block;
    }
    img {
    border: 0;
    }
    a {
    color: #990000;
    font-weight: bold;
    text-decoration: none;
    }
    a:hover {
    color: #FF7F00;
    text-decoration: underline;
    }
    .
    left {
    float: left;
    }
    .
    right {
    float: right;
    }
    .
    more {
    text-align: right;
    }
    .
    clear {
    clear: both;
    }

    body {
    background: #8E0D0D url(images/page_bg.jpg) repeat-x;
    text-align: center;
    font: 11px arial, sans-serif;
    color: #565656;
    }

    /** layout **/
    #wrapper {
    text-align: left;
    margin: auto;
    width: 788px;
    position: relative;
    }
    #left {
    position: absolute;
    top: 0;
    left: 0;
    width: 268px;
    }
    #right {
    position: absolute;
    top: 0;
    left: 268px;
    width: 520px;
    }

    /** Left **/
    #left {
    background: url(images/logo.jpg) no-repeat;
    padding-top: 30px;
    }
    #left h1 {
    text-align: center;
    font: 28px verdana, serif;
    color: #6C0505;
    height: 709px;
    }
    #copyright {
    color: white;
    }
    #copyright p {
    margin: 0 1em 0.5em 1em;
    }

    /** Right **/
    #nav {
    background: url(images/header.jpg) no-repeat;
    height: 68px;
    }
    #nav ul {
    margin: 0;
    padding: 0 0 0 5px;
    }
    #nav li {
    float: left;
    border-right: 1px solid #A26A6B;
    padding: 46px 9px 9px 9px;
    list-
    style: none;
    }
    #nav li.last {
    border-right: none;
    }
    #nav a {
    color: #CECECE;
    font: 10px arial, sans-serif;
    font-weight: normal;
    }
    #nav .selected a {
    font-weight: bold;
    }

    #subnav{
    background: url(images/header2.jpg) no-repeat;
    height: 24px;
    }
    #subnav ul {
    margin: 0;
    padding: 0 0 0 20px;
    }
    #subnav li {
    float: left;
    border-right: 0,5px solid #ffffff;
    padding: 6px 15px 9px 9px;
    list-
    style: none;
    }
    #subnav li.last {
    border-right: none;
    }
    #subnav li.search{
    text-align: left;
    }
    #subnav a {
    color: #CECECE;
    font: 9px arial, sans-serif;
    font-weight: normal;
    }
    #subnav .selected a {
    font-weight: bold;
    }

    /** Body **/
    #body {
    background: url(images/body_bg.jpg) repeat-y;
    }
    #body-top {
    background: url(images/body_top.jpg) no-repeat;
    }
    #body-bot {
    background: bottom left url(images/body_bot.jpg) no-repeat;
    padding: 36px 39px 19px 39px;
    text-align: left;
    }

    #body h2 {
    font: 14px "verdana", serif;
    text-align: left;
    }
    #body h2 strong {
    color: #660505;
    font-weight: normal;
    font-size: 18px;
    text-align: center;
    font-style: normal;
    }
    #body h3 {
    font: 14px "Times New Roman", serif;
    color: #660505;
    margin-top: 1.4em;
    margin-bottom: 1.1em;
    text-align: left;
    }
    #body h4 {
    color: #660505;
    text-align: left;
    }
    #body .left {
    margin: 0 26px 0 0;
    }

    /** footer **/
    .body-hr {
    clear: both;
    height: 43px;
    background: bottom left url(images/body_hr.jpg) no-repeat;
    margin: 10px -39px;
    }

    #footer-1 {
    float: left;
    width: 104px;
    padding-right: 30px;
    margin-top: 5px;
    border-right: 1px solid #ACACAC;
    font: 14px "times new roman", serif;
    color: #660505;
    text-align: center;
    }
    #footer-1 strong {
    display: block;
    font-size: 18px;
    font-weight: normal;
    }
    #footer-2 {
    float: left;
    width: 154px;
    margin-left: 12px;
    font: 18px "times new roman", serif;
    color: #000;
    line-height: 34px;
    }
    #footer-2 .left {
    margin-right: 12px;
    }
    #footer-3 {
    float: left;
    width: 135px;
    margin: 0;
    font: 14px "times new roman", serif;
    color: #000;
    text-align: center;
    }
    #footer-3 .left {
    margin-right: 12px;
    }
    div {
    font-family: Verdana, Geneva, sans-serif;
    }
    Come posso fare in modo che il form per la ricerca venga visualizzato a destra e che l'elenco a suo fianco (home, articoli, fotografie, diari) venga visualizzato a sinistra?

    http://enkantar.altervista.org è il sito in questione e la barra nera è la barra in questione dove vorrei visuaizzare a sinistra le scritte e a destra la ricerca! Scusate la poca chiarezza!
    Ultima modifica di musicanapoli : 05-04-2010 alle ore 21.59.07 Motivo: Scrivi un titolo esplicito ed utilizza anche i tag (vedi discussioni in rilievo in questa sezione)

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •