Salve sfruttando boostrap ho realizzato questo :
Queto il css :codice:<!DOCTYPE html> <html > <head> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Spidermail</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="css/css/default.css" rel="stylesheet" type="text/css" media="all" /> <link href="css/css/bootstrap.css" rel="stylesheet"> <link href="csss/css/bootstrap-responsive.css" rel="stylesheet"> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/prove.js"></script> </head> <body > <div id="container" class="container-fluid"> <div class="row-fluid"> <div id="pubblictasup" class="span12"> <h1>Pubblicità </h1> </div> </div> <div class="row-fluid"> <div id='logo' class="span4"> <h1>logo</h1> </div> <div id='menu' class="span8"> <nav> <ul> <li >Homepage [*]Prodotti [*]Ricerca --> [/list] </nav> </div> </div> <div class="row-fluid"> <div id= "pubblicitàsx" class="span2"><h1>Pub</h1></div> <div id="banner" class="span8"> <h1>testo<h1> </div> <div id= "pubblicitàdx" class="span2"><h1>Pub</h1></div> </div> <div id='footermain' class="row-fluid"> <div id="footer" class="span12"> Copyright (c) 2013 </p> </div> </div> </div> </body> </html>
HO 2 domande da farvi :codice:#container{ background-color: #2b2b2b; height: 100%; } #pubblictasup{ height: 100%; text-align: center; } #menu { float: right; width: 50%; height: 50%; padding: 20px 40px 0px 0px; } #menu ul { float: right; margin: 0; padding: 40px 0px 0px 0px; list-style: none; line-height: normal; } #menu li { float: left; } #menu a { display: block; margin-left: 1px; padding: 7px 20px 7px 20px; letter-spacing: 1px; text-decoration: none; text-align: center; text-transform: uppercase; font-family: 'Oswald', sans-serif; font-size: 16px; font-weight: 300; color: #FFFFFF; } #menu a:hover, #menu .current_page_item a { text-decoration: none; background: #1B5902; border-radius: 5px; color: #FFFFFF; } // banner #banner { height: 700px; overflow: hidden; width: 70%; text-align:center; margin: 0 0 0 0; background-color: greenyellow; color:red; border: 20px solid #FFFFFF; text-align:center; } #banner h1{ color: red; } // footer #footer { height: 100px; margin: 0 auto; padding: 50px 0px 50px 0px; text-align: center; } #footer p { text-align: center; font-size: 12px; color: #757575; } #footer a { color: #757575; }
1- Perchè il div banner non viene con il bordo bianco di 20px?
2- Perchè se applico il background-color al body non viene preso , mentre se lo metto al container si?
Rispondi quotando
