immagine da centrare

**andyv1957** · 26-11-2012, 15:30

Ho costruito una pagina Master con, nell'header, il logo (a sinistra) e una Div (a destra) per il titolo, non modificabile dalle pagine figlie. Sotto di queste, c'è un altra Div con un ContentPlaceHeader all'interno.

Nella pagina figlia (default.aspx) ho inserito, all'interno del ContentPlaceHeader, una Div dimensionata al 100% sia in larghezza che in altezza e all'interno di questa ho inserita l'immagine "sito in costruzione" da posizionare al centro.

Nonostante i tentativi l'immagine rimane ferma, in alto, a sinistra del Div. Facendo altri tentativi invece, nel VWD si posiziona correttamente al centro della Div e nel browser rimane in alto al centro (del div) e tutto il div si sposta in basso.

C'è qualcuno che può darmi una mano a capire come muovermi ???

Grazie anticipato per quasiasi aiuto mi venga dato.

P.S - Sono pochi giorni che ho iniziato a studiare ASP.Net e quindi sono molto "acerbo" in materia.

**codencode** · 26-11-2012, 15:47

Bisognerebbe vedere HTLM e CSS.

**homerbit** · 26-11-2012, 16:35

non è asp ma html+css, occorre vedere il codice, come già suggerito, o almeno il link
ciao

**andyv1957** · 26-11-2012, 20:53

Questo è il codice della pagina Master (il codice CSS non è in un file distinto)

-----------------------------

<%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="MasterPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title></title>

<style type="text/css">

#Body
{
margin: 0;
height: 100%;
background-color: white;
}

#Contenitore
{
width: 100%;
height: 100%
}

#Testata
{

width: 1240px;
height: 120px;
margin: 0 auto;
background-color: white;
}

div#ContenitoreLogo
{
margin-top: 10px;
width: 273px;
height: 100px;
float: left;
}

div#InTestata
{
margin-top: 20px;
border-radius: 25px;
border: solid 1px;
width: 947px;
height: 80px;
float: right;
background-color: lavender;
}

#AreaCentrale
{
border-radius: 25px;
border: solid 1px;
width: 1240px;
height: 854px;
margin: 0 auto;
background-color: lavender;
}

#Footer
{
width: 1240px;
height: 50px;
line-height: 50px;
margin: 0 auto;
margin-bottom: 0px;
background-color: white;
text-align: center;
}

.auto-style1 {
width: 273px;
height: 100px;
}

</style>

<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>

</head>

<body id="Body">

<form id="form1" runat="server">

<div id="Contenitore">

<div id="Testata">
<div id="ContenitoreLogo">
[img]Immagini/LogoC.jpg[/img]</div>

<div id="InTestata">

</div>

</div>

<div id="AreaCentrale">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">

</asp:ContentPlaceHolder>
</div>

<div id="Footer">

=== > ------------------------------------------------------------------- < ===

</div>

</div>

</form>

</body>

</html>

--------------------------------

e questo è quello della pagina figlia Default.aspx (CSS come pagina master)

--------------------------------

<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">

<style type="text/css">

#Content2
{
margin-top: 200px;
margin: 0 auto;
}

#DivPanel
{
width: 100%;
height: 100%;
}

.auto-style2
{
display: block;
width: 315px;
height: 224px;
margin-left: auto;
margin-right: auto;
}
</style>

<div id="DivPanel">
[img]Immagini/Sito_in_costruzione.gif[/img]
</div>

<%--<asp:Panel ID="Panel1" runat="server" width="100%" height="100%" >

</asp:Panel>--%>

</asp:Content>

ho tolto ogni riferimento al codice per centrare l'immagine perché non funzionava.

Ciao e nuovamente grazie.

**homerbit** · 27-11-2012, 02:22

non era necessario tutto il codice dal momento che volevi centrare solo l'immagine "in costruzione" della pagina figlia, ma non è un problema, serve solo per capire se...ho capito

Cmp il tuo codice è esatto! Quindi l'immagine in questione sta al centro!

A questo punto mi sorge un dubbio: vuoi posizionarla al centro assoluto del monitor oppure solo al centro del div che la contiene?

**andyv1957** · 27-11-2012, 04:44

Vorrei posizionarla al centro del Div che la contiene.
In effetti adesso si trova al centro della parte superiore di quel Div, proprio attaccata al lato superiore. Il problema è che non riesco a centrarla anche rispetto alla verticale.

Discussione: immagine da centrare

Strumenti discussione

Ricerca discussione

Visualizza

immagine da centrare

Permessi di invio