Верстка, CSS, HTML, SVG

Помогите с версткой!

Я только учусь, и мой вопрос покажется профессионалом очень простым, но прошу ответить по сути, без издевательств)
Для начала мне нужно сделать шапку, как на скриншоте.

html:



Россия, г. Краснодар
ул. Красная, 54


На карте

Звонок с сайта
Кликай и звони нам бесплатно

8(861)244-05-09

Гостиница
Номера и цены
Бронирование
Отзывы
Ресторан и бар
Конеференц-залы
Акции
Блог
Контакты

css:
#wrapper{
width: 999px;
margin: 0 auto;
}

Сейчас все отображается в столбик. Чтобы расположить все вертикально я пробовала использовать float, но у меня не получается. покажите пожалуйста код, что нужно написать чтобы было как на скриншоте? спасибо больше всем!
A*
Abag ***
102
если вы напишете мне в почту - я помогу составить вам всю страницу целиком - и потом подробно объясню
Евгений Водолазский
Евгений Водолазский
66 670
Лучший ответ
Неизвестно Неизвестно а научите адаптивной верстке? оч надо, пжл
шапку сделать position:relative;
блоки в ней - position:absolute;
для каждого из них подобрать нужные параметры top и left
li в меню сделать float:left
Саня Иванов
Саня Иванов
6 850
Abag *** Спасибо болшое!!!
ul>li{
display: inline-block;
}
для более полного понимания изуучи свойство display
и забудь про float
LА
Love Акбар
4 023
http://www.site-do.ru/css/css11.php - Вот Ваш ответ, но лучше прочтите все 14 уроков, на понимание уйдет 2 часа для изучения основ css.

http://htmlbook.ru/ - а это Ваш помощник в дальнейшем.

p.s пользоваться нужно исключительно в большей степени float, а position:relative и position:absolute свести к минимуму.

float - Ваш ключ в будущем, когда Вы накопите определенный опыт и решите сделать свой сайт адаптивным.
Сплошноййй Позитиффф Я
Сплошноййй Позитиффф Я
2 879
Abag *** Спасибо вам огромное за ответ и советы!
Если вы хотите сделать блочную верстку с float: left, то вам нужно определиться с блоками, например, как на рисунке.
Но все же, я бы советовал здесь частично сделать табличную вёрстку, но это уже дело вкуса, лично я ничего не имею против табличной верстки, когда она уместна, ибо она проста и кроссбраузерна.
И ещё, избегайте тега p, лучше вместо него используйте универсальный div или строчный span (р - блочный!). Также li является блочным тегом, поэтому указывайте для него display: inline;, т. к. проще будет ссылки поместить в строку. Опять же, тут дело вкуса, я не настаиваю.
Сочневы Мы
Сочневы Мы
1 398
Abag *** Спасибо вам огромное за комментарий! В будущей компании, где я буду работать помощником, разрешают использовать таблицы только там, где таблица. хотя я в табличной верстке смыслю гораздо больше. а современную никак не могу освоить. Спасибо вам за советы отночительно блочных тегов! Сейчас попробую!
Майл зараза захавал код сейчас придумаю как отобразить...

======================
Думаю дальше доделаете сами, знаю верстальщики бросят в меня тапком но в меня алиби! Я - ленивая жопа))
Табличная верстка прошлый век.
Вот почитайте будет полезно: http://habrahabr.ru/post/202408/
NV
Nunok V
507
Nunok V Это просто пзд в такие моменты я хочу убить майл....
Крч:
dumpz(точка) org / 1332836/

Похожие вопросы