Dark_Semi
-
Posts
4 -
Joined
-
Last visited
Dark_Semi's Achievements
Explorer (1/14)
0
Reputation
-
Задать им этот цвет фона, естественно в CSS Пробывал прописать стиль после .main, и задать ему параметры в css - заливается либо шапка, либо весь фон сайта, а мне нужен только этот блок
-
terminotor, спасибо) А как сделать белый фон не на весь шаб, а для контента и сайтебара (как на 1 картинке)
-
Добрый день! Поплыли блоки в сайтебаре, подскажите как поправить... Хочу вот так - Пока вот так - А так же подскажите, как сделать белый блок (для всего контента + сайтебар) (есть в 1 скрине, но нет во 2) HTML <!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" /> <link rel="stylesheet" type="text/css" href="style.css"/> <title>GRead beta</title> </head> <body> <div class="main"> <div class="head"> </div> <div class="content"> <div class="post-main"> <h1><a href="#">Welcom</a></h1> <div class="post"> Hello, Friends.</p>GRead helps you to read book conveniently. But I will not tell a lot better to look screencast: </p> If you have any question, send in to me: <a href="#">spirt40@gmail.com</a> </div> </div></div> <div class="sitebar"> <div class="vidget"> <h2>Log in</h2> <ul> <form method="post" name="registration" id="registration" action="#"> <span id="text1">Username: </span> <input type="text" name="name" id='name' /> <span id="text1">Password:</span> <input type="password" name="password1" id="pass"/> <div class="send-form"> <input type="submit" name="submit" value="Sing up" onclick="check()" class="send-button"/> <a href="#">remember me password</a> </div> </form> <img src=Images/bg-menu.jpg align="left"> or use OpenID: <a href="#">Google</a> <a href="#">Yahoo</a> <a href="#">other</a> </ul> </div> <div class="reklama"> <div class="vidget2"> <h2>Sign in</h2> <ul> <script language="JavaScript"> function check() { var name = document.getElementById('name').value; var pass = document.getElementById('pass').value; var email = document.getElementById('email').value; if (name == ''||pass == ''||email == '') return alert('Please fill in all fields'); var reg = /[0-9a-z_]{2,8}/i; if(reg.exec(pass) == null){ alert("Username must be up to 8 characters"); document.getElementById('pass').value=""; return false; } if(reg.exec(email) == null){ alert("Please correctly enter your e-mail"); document.getElementById('email').value=""; return false; } if(reg.exec(pass) == null){ alert("Password must be 8 characters long and contain only letters tsyfry"); document.getElementById('pass').value=""; return false; } reg = /[0-9a-z_]+@[0-9a-z_^.]+\.[a-z]{2,3}/i; } </script> <form method="post" name="registration" id="registration" action="#"> <li><span id="text1">Username: </span> <input type="text" name="name" id='name' /></p></li> <li><span id="text1">E-Mail:</span> <input type="text" name="email" id="email" /></p></li> <li><span id="text1">Password:</span> <input type="password" name="password1" id="pass"/></p></li> I have agree to the <a href="#">Terms:</a> <input type="checkbox" name="option" value="a4"></p> <div class="send-form"> <input type="submit" name="submit" value="Sing up" onclick="check()" class="send-button"/> </div> </form> </ul> <div class="reklama1"> <div class="vidget22"> <h2>News</h2> <div class="post"> Now fix bug with " ". If U have this symbol in a book, then click to "reProcess book" in edit's book menu. </div></div> <div class="footer"> </div></div> </body> </html> CSS @charset "utf-8"; /* CSS Document */ * { padding:0; margin:0;} body {background:#e7e7df url(Images/bg-body.jpg) left top no-repeat; } .main { width:1050px; margin:0 auto;} .head{ height:40px;} .content-main{ background:#fffdfd; overflow:hidden; } .content{ width:730px; float:right; margin:15px 15px 15px 0; } .post-main{ background:#ffffff; margin:0; } .post-main h1{ font:14px Verdana, Geneva, sans-serif;color:;background:#4ebbff; padding:5px 20px 8px 15px; margin:0; } .post-main h1 a{ font: normal 14px Verdana, Geneva, sans-serif;color:#000000;text-decoration:none; } .post-main h1 a:hover{ font: normal 14px Verdana, Geneva, sans-serif;color:#000000;text-decoration:underline; } .imgstyle{ float:left; margin:0; } .post{ margin:0; } .post p{ font:12px Verdana, Geneva, sans-serif;color:#000; margin:0; } .post p a{ color:#423e3e; text-decoration:underline; } .sitebar{ width:275px; float:left; margin:15px 15px 15px 15px; } .vidget{ background:#ffffff; margin:0; } .vidget h2{ font:14px Verdana, Geneva, sans-serif; background:#66cc9a; color:#000; padding:5px 20px 8px 15px; margin:0; } .vidget ul{ list-style:none;padding:10px 10px; } .reklama{width:275px; float:left; margin:15px 15px 15px 15px; } .vidget2 { background:#ffffff; margin:0; } .vidget2 h2{ font:14px Verdana, Geneva, sans-serif; background:#f3a950; color:#000; padding:5px 20px 8px 15px; margin:0; } .vidget2 ul{ list-style:none;padding:10px 10px; } .vidget2 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 5px 5px 20px; } .vidget2 ul li a{ text-decoration:none; color:#000; } .reklama1 {width:275px; float:left; margin:15px 15px 15px 15px; } .vidget22 { background:#ffffff; margin:0; } .vidget22 h2{ font:14px Verdana, Geneva, sans-serif; background:#fc575e; color:#000; padding:5px 20px 8px 15px; margin:0; } .vidget22 ul{ list-style:none;padding:25px 15px; } .vidget22 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget22 ul li a{ text-decoration:none; color:#000; } .footer { font:14px Verdana, Geneva, sans-serif; }
-
Добрый день! Первый раз верстаю шаблон, и уже успел столкнуться с проблемой. Хочу сверстать вот такой шаблон - СSS - @charset "utf-8"; /* CSS Document */ * { padding:0; margin:0;} body {background:#e7e7df url(Images/bg-body.jpg) left top no-repeat; } .main { width:960px; margin:0 auto;} .head{ height:40px;} .content-main{ background:#fffdfd; overflow:hidden; } .content{ width:730px; float:right; margin:15px 15px 15px 0; } .post-main{ background:#ffffff; margin:0; } .post-main h1{ font:24px Verdana, Geneva, sans-serif;color:;background:#4ebbff; padding:5px 20px 8px 15px; margin:0; } .post-main h1 a{ font: normal 24px Verdana, Geneva, sans-serif;color:#ffffff;text-decoration:none; } .post-main h1 a:hover{ font: normal 24px Verdana, Geneva, sans-serif;color:#ffffff;text-decoration:underline; } .imgstyle{ float:left; margin:0; } .post{ margin:0; } .post p{ font:12px Verdana, Geneva, sans-serif;color:#000; margin:0; } .post p a{ color:#423e3e; text-decoration:underline; } .sitebar{ width:275px; float:left; margin:0 15px 15px 0; } .vidget{ background:#ffffff; margin:0; } .vidget h2{ font:18px Verdana, Geneva, sans-serif; background:#66cc9a; color:#000; padding:5px 0; } .vidget ul{ list-style:none;padding:25px 15px; } .vidget ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget ul li a{ text-decoration:none;color:#000; } .reklama{width:275px; float:left; margin:0 15px 15px 0; } .vidget2 { background:#ffffff; margin:0; } .vidget2 h2{ font:18px Verdana, Geneva, sans-serif; background:#66cc9a; color:#000; padding:5px 0; } .vidget2 ul{ list-style:none;padding:25px 15px; } .vidget2 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget2 ul li a{ text-decoration:none; color:#000; } .reklama1 {width:275px; float:left; margin:0 15px 15px 0; } .vidget22 { background:#ffffff; margin:0; } .vidget22 h2{ font:18px Verdana, Geneva, sans-serif; background:#fc575e; color:#000; padding:5px 0; } .vidget22 ul{ list-style:none;padding:25px 15px; } .vidget22 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget22 ul li a{ text-decoration:none; color:#000; } .footer { font:14px Verdana, Geneva, sans-serif; } .reklama{width:207px; float:left; margin:0; padding:20px 0 0 0; } .vidget2 { background:#ffffff; margin:0; } .vidget2 h2{ font:18px Verdana, Geneva, sans-serif; background:#f3a950; color:#000; padding:5px 0; } .vidget2 ul{ list-style:none;padding:25px 15px; } .vidget2 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget2 ul li a{ text-decoration:none; color:#000; } .reklama1 {width:207px; float:left; margin:0; padding:20px 0 0 0; } .vidget22 { background:#ffffff; margin:0; } .vidget22 h2{ font:18px Verdana, Geneva, sans-serif; background:#fc575e; color:#000; padding:5px 0; } .vidget22 ul{ list-style:none;padding:25px 15px; } .vidget22 2ul li{ font:14px Verdana, Geneva, sans-serif; color:#000; padding:5px 0 5px 20px; } .vidget22 ul li a{ text-decoration:none; color:#000; } .footer { font:14px Verdana, Geneva, sans-serif; } HTML - <!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" /> <link rel="stylesheet" type="text/css" href="style.css"/> <title>GRead beta</title> </head> <body> <div class="main"> <div class="head"> </div> <div class="content"> <div class="post-main"> <h1><a href="#">Welcom</a></h1> <div class="post"> Hello, Friends.</p>GRead helps you to read book conveniently. But I will not tell a lot better to look screencast: </p> If you have any question, send in to me: <a href="#">spirt40@gmail.com</a> </div> </div></div> <div class="sitebar"> <div class="vidget"> <h2>Log in</h2> <ul> <li>- <a href="#">История макияжа</a></li> <li>- <a href="#">Правила макияжа</a></li> <li>- <a href="#">Уроки макияжа</a></li> <li>- <a href="#">Макияж глаз</a></li> <li>- <a href="#">Макияж звезд</a></li> </ul> </div> <div class="reklama"> <div class="vidget2"> <h2>Реклама</h2> <ul> <li><center><img src=Images/reklama1.jpg></center></p><center><a href="#">Стрижки, не требующие укладки</a></center></li> </ul> </div> <div class="reklama1"> <div class="vidget22"> <h2>Реклама</h2> <ul> <li><center><img src=Images/reklama1.jpg></center></p><center><a href="#">Стрижки, не требующие укладки</a></center></li> </ul> </div></div> <div class="footer"></div> <br /> </div></div></div> </body> </html> Получилось вот что - В общем пока не выходит.. Подскажите что и как нужно исправить, чтоб было так как на 1 картинке