Posizionare Iframe e menù a discesa

valerio.capo

Nuovo Utente
23 Lug 2015
7
0
0
Ciao a tutti, sono alle prime armi con Html e Css.

Ho creato due Div, uno "sopra" e l'altro "sotto".

Nel div "sotto" ho scritto dei paragrafi e vorrei aggiungere accanto a questi paragrafi un frame. Ho scritto il codice html e dato le proprietà ma non riesco a posizionarlo a destra dei testi. ll frame si posiziona sotto e mi va nel footer.

Cosa devo modificare? ho scritto align="center" o "right" all'interno del frame e non succede nulla.

Anche aggiungendo un menù a discesa, questo mi va sempre sotto.

Come faccio a posizionarlo? Ad esempio: i paragrafi a sinistra come sono, al centro il menù a tendina e il frame a destra.

Ecco il codice html completo:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ristorante Vitorchiano, Viterbo - Osteria Basilicò</title>
<meta name="description" content="Benvenuti nel sito del nostro ristorante situato a Vitorchiano a pochi passi da Viterbo"/>
<meta name="keywords" content="ristorante Vitorchiano, osteria Vitorchiano,osteria a Vitorchiano"/>
<link rel="stylesheet" type="text/css" href="css/stile.css"/>
<!-- Start VisualLightBox.com HEAD section -->

<link rel="stylesheet" href="index_files/vlb_files0/vlightbox0.css" type="text/css" />

<link rel="stylesheet" href="index_files/vlb_files0/visuallightbox.css" type="text/css" media="screen" />
<script src="index_files/vlb_engine/jquery.min.js" type="text/javascript"></script>

<script src="index_files/vlb_engine/visuallightbox.js" type="text/javascript"></script>

<!-- End VisualLightBox.com HEAD section -->

</head>
<body>
<div id="container">
<div id="riga">
<p align="center"> Tel: +39 0761.34.07.86</p>
</div>
<div id="menu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="Menu.html">Menu</a></li>
<li><a href="Pizzoleria.html">Pizzoleria</a></li>
<li><a href="Gallery.html">Gallery</a></li>
<li><a href="Contatti.html">Contatti</a></li>
</ul>
<p><a href="Menu.html"><img alt="Logo Rist" src="img/Logo.jpg" title="ristorante viterbo" class="immagine" /> </a></p>
</div>
<div id="testata"></div>
<div id="contenuti">
<div id="sopra">
<p>L'Osteria Basilicò nasce da un'idea, tornare ai sapori di una volta; da una voglia, far gustare ricette antiche preparate con cotture tradizionali e rigorosamente con prodotti freschi di giornata.</p>
<p>Noi puntiamo sulla tradizione Italiana, senza limitarci al solo Lazio e sempre affascinati dalla scoperta di tutti quei piatti che hanno reso celebre la cucina italiana nel mondo.</p>
<p>Senza dimenticare che l'Osteria accosta il pasto al vino: per questo abbiamo selezionato anche circa 300 tra le migliori etichette provenienti da ogni regione d'Italia.</p>
<p>Basilicò è anche una BRACERIA di altissima ricerca, con selezioni di carni italiane e estere. Tra le nostre carni:Chianina , Cinta Senese, Angus Argentino, Polacco, Americano, Scozzese, la mitica Tomahawk , Kobe. Se siete amanti di carne alla brace non potete non venire.</p>
<p>Per scoprire l'Italia del gusto, veniteci a trovare e resterete ammaliati da quante ricette della tradizione dovete ancora assaggiare.</p>
<p align="right"><strong>Valerio Caporossi</strong></p>
<h1>Photo Gallery</h1> <!-- Start VisualLightBox.com BODY section id=0 -->

<div id="vlightbox0">

<a class="vlightbox0" href="index_files/vlb_images0/sala_1.jpg" title="Sala 1"><img src="index_files/vlb_thumbnails0/sala_1.jpg" alt="Sala 1"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_2.jpg" title="Sala 2"><img src="index_files/vlb_thumbnails0/sala_2.jpg" alt="Sala 2"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_3.jpg" title="Sala 3"><img src="index_files/vlb_thumbnails0/sala_3.jpg" alt="Sala 3"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_4.jpg" title="Sala 4"><img src="index_files/vlb_thumbnails0/sala_4.jpg" alt="Sala 4"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_5.jpg" title="Sala 5"><img src="index_files/vlb_thumbnails0/sala_5.jpg" alt="Sala 5"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_6.jpg" title="Sala 6"><img src="index_files/vlb_thumbnails0/sala_6.jpg" alt="Sala 6"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_7.jpg" title="Sala 7"><img src="index_files/vlb_thumbnails0/sala_7.jpg" alt="Sala 7"/></a>
<a class="vlightbox0" href="index_files/vlb_images0/sala_8.jpg" title="Sala 8"><img src="index_files/vlb_thumbnails0/sala_8.jpg" alt="Sala 8"/></a>
<span class="vlb"><a href="http://visuallightbox.com">simple lightbox jquery</a>by VisualLightBox.com v6.1</span>

</div>

<script src="index_files/vlb_engine/vlbdata0.js" type="text/javascript"></script>

<!-- End VisualLightBox.com BODY section -->



</div>
</div>
<div id="sotto">
<h2>ORARIO RISTORANTE</h2>
<p>lunedì: Aperto <b>PRANZO/CENA</b></p>
<p>martedì: <b>CHIUSO</b></p>
<p>mercoledì: Aperto <b>PRANZO/CENA</b></p>
<p>giovedì: Aperto <b>PRANZO/CENA</b></p>
<p>venerdì: Aperto <b>PRANZO/CENA</b></p>
<p>sabato: Aperto <b>PRANZO/CENA</b></p>
<p>sabato: Aperto <b>PRANZO/CENA</b></p>
<iframe width="420" height="200" src="https://www.youtube.com/embed/LDu3nv0j_lg" frameborder="0" allowfullscreen></iframe>
</div>
</div>
<div id="footer">
<p class="footer">Osteria Basilicò - Via de La Quercia, 15/b Vitorchiano (VT) - Tel. +39.0761.3704</p></div>
</div>
</body>
</html>



IL CSS è:

@charset "utf-8";
/* CSS Document */
#menu
{
width:1024px;
height:50px;
background-color:#FFF;
}

#container
{
width:1024px;
padding:0;
margin:auto;
}

#testata
{
width:1024px;
height:340px;
padding-top:0;
border-style:solid;
border-width:medium;
background:url(../img/Ristorante.jpg);
}

#riga
{
width:1024px;
height:50px;
background-color:#630;
}


#contenuti
{
width:1024px;
height:500px;
background:#FFF;
padding-top:0;
}

#sopra
{
width:1024px;
height:250px;
background-color:#FFF;
}

#sotto
{
width:1024px;
height:250px;
margin-top:35px;
background-color:#630;
}

#footer
{

width:1005px;
height:150px;
background-color:#630;
margin-top:10px;
margin-left:152px;
padding-top:10px;
padding-left:20px;
text-align:center;
}

.footer
{
margin:0;
padding:0;
padding-top:50px;
color:#FFF;
}

#menu ul
{
margin:0;
padding-top:10px;
list-style:none;
padding-left:0;

}

#menu li
{
float:left;
margin-left:10px;
}

#menu a
{
text-decoration:none;
color:#000;
font-family:Arial, Helvetica, sans-serif;
text-transform:uppercase;
}

#menu a:hover
{
text-decoration:none;
color:#FF3;
font-family:Arial, Helvetica, sans-serif;
text-transform:uppercase;
}




h1{
margin:0
padding-top:10px;
padding-left:10px;
font-family:"Times New Roman", Times, serif;

}

h2{
margin:0;
padding-top:10px;
padding-left:10px;
font-family:"Times New Roman", Times, serif;
color:#FFF;
font-size:12px;
}

p
{
margin:0;
padding-top:10px;
padding-left:10px;
padding-right:20px;
font-family:"Times New Roman", Times, serif;
font-size:14px;
}

.immagine
{
width:200px;
height:50px;
margin-left:30px;
border:double;
border-color:#F00;

}





GRAZIE MILLE E SCUSATE!
 

n1k4r0

Utente Attivo
15 Nov 2012
135
0
0
sinceramente non ho capito chiaramente quello che vuoi ottenere ma forse quello che ti serve è una regola css.
dovresti provare ad assegnare al frame (che poi penso sia un iframe visto che un frame non si aggiunge alla pagina ma la divide in più parti) una regola css che è:

Codice:
float: right;

puoi farlo nel file stile.css oppure direttamente nel iframe con una cosa tipo questa

HTML:
<iframe style="float: right;" ... >
 
Discussioni simili
Autore Titolo Forum Risposte Data
K posizionare variabile da pagina html all'iframe. Javascript 1
Shyson [CSS] Posizionare casella di ricerca HTML e CSS 3
M Posizionare una tabella con scroll su un elemento specifico PHP 3
P Cerco Seo per posizionare pagine Offerte e Richieste di Lavoro e/o Collaborazione 2
Creatt [PHP] Posizionare e formattare testo PHP 13
S Posizionare player audio javascript in tabella Javascript 0
Shyson Dove posizionare i codici php? PHP 5
A posizionare dialog uial centro dello schermo jQuery 1
Shyson Posizionare testo vicino all'immagine HTML e CSS 1
P posizionare overlay non al centro jQuery 0
S cerco programmatore esperto javascript, php e in grado di posizionare il sito online.. Offerte e Richieste di Lavoro e/o Collaborazione 0
A Come posizionare centralmente in modalità fissa un logo in una pagina html HTML e CSS 5
D posizionare un' elemento in una posizione definita jQuery 5
zighy Posizionare un div da coordinate database Javascript 8
E Posizionare widget?? HTML e CSS 0
A Posizionare i div HTML e CSS 0
A posizionare la riproduzione di un FLV con action script Flash 0
M posizionare un sito su google SEO e Posizionamento 1
catellostefano Strutture per posizionare server Web Server 0
G Che diverso dominio per posizionare sito inglese? Domini 0
Nik Posizionare un div (contenente una tabella) al centro, problema con mozilla HTML e CSS 0
ale-inka Come posizionare un banner a sinistra? HTML e CSS 5
c.ronaldo Posizionare una finestra in basso a destra delllo schermo Programmazione 2
U Come posso posizionare questo codice ? HTML e CSS 5
F Problema nel posizionare popup... Javascript 3
N Aiuto CSS, come posizionare un'immagine centralmente HTML e CSS 4
E posizionare correttamente una stringa HTML e CSS 0
L Iframe a schermo intero HTML e CSS 0
L Sovrascrivere CSS iframe su dominio diverso WordPress 0
P [Joomla] Il mio iframe non funziona più Joomla 0
A [Java] caricare un url esterno senza utilizzo di iframe Java 0
T [Javascript] Richiamare un file.js (iframe) in html Javascript 1
A [HTML] iframe HTML e CSS 1
Tommy03 [PHP] Iframe Google Maps PHP 1
S Cliccando su iFrame con JavaScript Javascript 2
C [Javascript] [HTML] È possibile "puntare" un iframe? Javascript 14
D [PHP] [RETRIBUITO] cercasi esperto programmatore per realizzare applicazione in html e codice iframe PHP 0
D [RETRIBUITO] cercasi esperto programmatore per realizzare applicazione in html e codice iframe Offerte e Richieste di Lavoro e/o Collaborazione 2
J [HTML] problema IFrame con dispositivi IOS HTML e CSS 0
L Come caricare <iframe> dopo il click ad un immagine, per migliorare le prestazioni. Discussioni Varie 0
G [HTML] Visualizzare iframe in un blog non funziona sempre xchė? HTML e CSS 3
A [RISOLTO] Table elaborata da codice PHP con dati da DB non visualizzata in IFRAME PHP 15
B [PHP] Copiare testo da iframe dopo il caricamento? PHP 1
W [Javascript] Problema: Copiare testo da un iframe? Javascript 4
giannit [HTML] Mettere div al posto di iframe e possibile? HTML e CSS 9
A [Javascript] [HTML] Gestire una pagina esterna con 2 iframe Javascript 4
F [HTML] caricamento iframe HTML e CSS 1
G [Javascript] rendere visibile un iframe dopo l'avvenuto caricamento del video che esso contiene Javascript 4
F [Javascript] Div ed iframe che adatta altezza in base al contenuto Javascript 1
L Eliminare suono da iframe HTML e CSS 3

Discussioni simili