Question

我有一个结构简单的页面，有很多div重复相同的内容（文本和两个图像），我需要这个打印一个在firefox中不重复的图像，这是一个例子：

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<meta charset="UTF-8">
<title>Cupones de descuento</title>
</head>

<body>
<div class="content">
<!---------------------------------------CUPON TURISTA--------------------------------------->
    <img src="img/cortesup.png" class="corte" />
    <div class="cupon">
        <div class="logo"><img src="img/logobuzios.png" class="logobuzios" alt="logobuzios" /></div>
            <div class="cont">
                <h3>CUPON N°:</h3>
                <p>Nombre:</p>
                <p>DNI:</p>
                <p class="info">Válido desde DD/MM/AA hasta DD/MM/AA</p>
                    <img src="img/separador.png" class="separador" alt="separador"/>
                <h3>MENÚ TURISTA</h3>
                    <p>VÁLIDO PARA: 1 (UN) ALMUERZO O CENA</p>
                    <p class="turista">Menú Turista: Incluye 1 (un) plato de entrada a elección + Incluye 3 (tres)
                                        opciones de plato principal + Incluye 1 (un) postre a elección.<br />
                                        NO Incluye Bebida. Horario de atención: 12 a 21:30 hs.</p>
                    <img src="img/separadordos.png" class="separador" alt="separador"/>
                <p class="restaurant"><strong>RESTAURANTES ASOCIADOS:</strong> CLUB LA PLAGE - DON JUAN - BAR DO MANGUE - BUZIN - 
                    ENU SUSHI - LA DOLCE VITA - PATIO HAVANA - NOI - PURO SABOR - SAN TELMO - DONA FLOR 
                    MINEIROS GRILL - LORENZO - RINCON - PARVATI.</p>
            </div>
            <div class="pie">
                <p class="asociados">Visite nuestro listado de <strong>Restaurantes Asociados</strong></p>
                    <img src="img/cubiertos.png" class="cubiertos" alt="cubiertos"/>
                <p class="web">www.grupobuziosgourmet.com</p>
            </div>

    </div>

    <!--Datos útiles-->

    <div class="datos">
        <div class="datoshead">
            <p class="datosutiles">DATOS ÚTILES</p>
        </div>

            <p class="utiles">El pasajero titular deberá presentar el o los vouchers impresos en el restaurante que haya seleccionado para consumir.<br />
            <strong>UBICACIÓN DE RESTAURANTES:</strong><br />
            <strong>CENTRO DE BÚZIOS:</strong> DON JUAN - BUZIN - LA DOLCE VITA - ENU SUSHI - PATIO HAVANA - NOI - PARVATI - PURO SABOR - MINEIROS GRILL - LORENZO.<br />
            <strong>JOÃO FERNANDES:</strong>  CLUB LA PLAGE - DONA FLOR.<br />
            <strong>MANGUINHOS:</strong> BAR DO MANGUE (PORTO DA BARRA).<br />
            <strong>ORLA BARDOT:</strong> MATAHARI - RINCON (CENTRO).<br />
            <strong>FERRADURA:</strong> SAN TELMO (SOBRE AV. PRINCIPAL).<br />
            <strong>HORARIO DE ATENCIÓN:</strong><br />
            Todos los restaurantes asociados a Grupo Búzios Resto atienden de 12 a 21.30HS.
            <strong>Excepto Club La Plage (sólo almuerzo con bebida + 1 café o caipirinha de cortesía) de 12 a 16 hs. Dona Flor (sólo cena) de 18 a 21.30 hs.</strong>
            Ante cualquier inconveniente podrá comunicarse de L a V al tel. +5411-5275-0075 y a nuestro servicio de guardia los fines de semana: Cel. Búzios: +0055-22 9227-8174 / +0055-22 99282-2067
            </p>

    </div>

我试过把高度：100％;和min-height对于body和html来说也是100％，在div容器中也是如此，但仍然无效。

谢谢！

Answer 1

你试试这个。

html{
  height: 100%;
}
body {
  min-height: 100%;
}

参考此网址： Make body have 100% of the browser height

Answer 2

我更新了你的小提琴：你必须从html和body中删除height: 100%，然后像这样使用它：

body {float: left;}
#content {float: left;}

https://jsfiddle.net/7x32pna7/1/

希望有所帮助

Answer 3

尝试：

body {float: left;
margin: 0px;
height: 100%;
width: 100%;
}

html，body：100％不工作

3 个答案: