OlegALL Posted January 9, 2011 Report Share Posted January 9, 2011 Здравствуйте. Задача - выровнять блок div по центру по вертикали и по горизонтали. Использую решение margin: 0px auto; , но оно не работает ни в Файрфлкс, ни в IEЕсть ли ещё способы?Помогите! Спасибо Quote Link to comment Share on other sites More sharing options...
0 Vlad Posted January 9, 2011 Report Share Posted January 9, 2011 1. Не задана ширина div2. доктайп не указан Quote Link to comment Share on other sites More sharing options...
0 sigma77 Posted January 9, 2011 Report Share Posted January 9, 2011 OlegALL,Ссылку на страницу или кусок проблемного кода (всё выкладывать не нужно!). Quote Link to comment Share on other sites More sharing options...
0 psywalker Posted January 9, 2011 Report Share Posted January 9, 2011 Здравствуйте. Задача - выровнять блок div по центру по вертикали и по горизонтали. Использую решение margin: 0px auto; , но оно не работает ни в Файрфлкс, ни в IEЕсть ли ещё способы?Помогите! СпасибоВыровнять во всём окне или в отдельном блоке? Покажи скрины. Quote Link to comment Share on other sites More sharing options...
0 OlegALL Posted January 9, 2011 Author Report Share Posted January 9, 2011 (edited) Заработало по горизонтали. А ка сделать выравнивание и по вертикали?Выровнять надо относительно окна браузераВыравнивается блок с классом main<!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" xml: lang="en" lang = "eng"><head><meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /><title></title><link href="index.css" rel="stylesheet" type="text/css" /></head><body><div class="main"><div class="sticker">The combination of special <br> massage therapy, reflexology <br> without needles and stone therapy <br> relieves pain, regains and optimizes <br>natural functions of the body <br> without any side effects.</div><div class="contacts"><a href="">Performed by certified massage therapist in <br>Grand Rapids, Michigan. Ph (616) 550 6819</a></div></div></body></html>css:.main { position: relative; width: 778px; height: 549px; margin: 0px auto; background: url(images/main.jpg);} Edited January 9, 2011 by OlegALL Quote Link to comment Share on other sites More sharing options...
0 psywalker Posted January 9, 2011 Report Share Posted January 9, 2011 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>Centr</title> <style type="text/css"> *{ margin: 0; padding: 0;} div.wrap { width: 510px; height: 306px; position: absolute; top: 50%; left: 50%; margin-top: -153px; margin-left: -255px; border: 1px solid #000; } div.center { width: 100px; height: 100%; position: absolute; left: 205px; top: 0; } span { display: block; width: 98px; height: 99px; border: 1px solid #808080; } span.right { position: absolute; right: 0; top: 105px;} span.left { position: absolute; left: 0; top: 105px;} </style></head><body> <div class="wrap"> <div class="center"> <span class="top"></span> <span class="cent"></span> <span class="bottom"></span> </div> <span class="right"></span> <span class="left"></span> </div></body></html> Quote Link to comment Share on other sites More sharing options...
0 Протуберанец Posted January 10, 2011 Report Share Posted January 10, 2011 (edited) span { display: block; width: 98px; height: 99px; border: 1px solid #808080; }А почему "height: 99px;" ? Там если поставить 100рх как раз в большой прямоугольник влезает, а так внизу три пикселя осталось. Edited January 10, 2011 by Протуберанец Quote Link to comment Share on other sites More sharing options...
0 psywalker Posted January 10, 2011 Report Share Posted January 10, 2011 А почему "height: 99px;" ? Там если поставить 100рх как раз в большой прямоугольник влезает, а так внизу три пикселя осталось.Да это я торопился наверное. Ерунда. Quote Link to comment Share on other sites More sharing options...
0 Протуберанец Posted January 10, 2011 Report Share Posted January 10, 2011 Да это я торопился наверное. Ерунда. Не, если ты в это смысл вкладывал, то хотелось бы понять в чем смысл, а то смотрю, вроде что-то не то . Опечатка знач. Quote Link to comment Share on other sites More sharing options...
0 psywalker Posted January 10, 2011 Report Share Posted January 10, 2011 Не, если ты в это смысл вкладывал, то хотелось бы понять в чем смысл, а то смотрю, вроде что-то не то . Опечатка знач.Ага, опечатка Quote Link to comment Share on other sites More sharing options...
0 OlegALL Posted January 10, 2011 Author Report Share Posted January 10, 2011 Извините, эти коды к моему вопросу относятся? Quote Link to comment Share on other sites More sharing options...
0 psywalker Posted January 10, 2011 Report Share Posted January 10, 2011 Извините, эти коды к моему вопросу относятся?Да, ты разве не видишь, что блок выровнен по центру? Quote Link to comment Share on other sites More sharing options...
Question
OlegALL
Здравствуйте. Задача - выровнять блок div по центру по вертикали и по горизонтали.
Использую решение margin: 0px auto; , но оно не работает ни в Файрфлкс, ни в IE
Есть ли ещё способы?
Помогите! Спасибо
Link to comment
Share on other sites
11 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.