Jump to content
Дизайн и модификация IPS Community IPBSkinsBETA
Search In
  • More options...
Find results that contain...
Find results in...
Sign in to follow this  
winterfall

Выравнивание блоков дизайна

Recommended Posts

Вообщем-то суть проблемы вот в чем, сейчас переделываю дизайн, я новичок в этой области и возник серьезный вопрос по поводу смещения блоков div, как их можно выравнить посредством css? Или есть еще какие либо варианты, то есть чтобы блоки шли ни один за другим, а на одном уровне и не сползали бы, помогите пожалуйста!

Далее там скрин и код оттдуа...сверху соответственно идит logostrip, слева идет leftmenu, ну и остальные думаю понятны

 

.borderwrap,
.borderwrapm{ /* this will affect the outlining border of all the tables and boxes through-out the skin. */
border: 0px solid #b7ae93;
padding: 0px; 
margin: 0px; 
overflow:hidden;
display:inline-block
}

.borderwrapm{
margin: 5px;
}

.borderwrap h3,
.maintitle,
.maintitlecollapse{
background: #E7ECF3 url(style_images/<#IMG_DIR#>/cat.gif);
border: 0px;
border-bottom: 1px solid #FCE47E;
color: #683500; 
font-size: 12px;
font-weight: bold; 
margin-left:14%;
padding: 5px;
}

.maintitle td {
color: #683500; 
font-size: 12px;
font-weight: bold;
}

.borderwrap h3{
background: #74a94b;
}

#logostrip{ 
background-image: url(style_images/<#IMG_DIR#>/tile_back.png);
height: 100px;
margin: 0;
padding: 0;
}

#submenu{ 
background: #E7ECF3 url(style_images/<#IMG_DIR#>/sub.gif);
border: 1px solid #d6ae51;
border-top: 1px solid #fff;
color: #683500; 
margin-left: 19%;
height: 21px;
text-align: right;
}

#leftmenu{ 
background-image: url(style_images/<#IMG_DIR#>/09.jpg);
height: 20%;
overflow:hidden;
width:13%
}

Вот html код

<div class="borderwrap">
<div id="logostrip"><a href='{ibf.script_url}'><!--ipb.logo.start--><img src='style_images/<#IMG_DIR#>/logo.png' style='vertical-align:top' alt='Клуб качества' border='0' /><!--ipb.logo.end--></a></div>
<div id="leftmenu"><img src='style_images/<#IMG_DIR#>/09.jpg'  'border='0' 
</div>
<div id="submenu">
	<!--ipb.leftlinks.start-->
	<if="{ibf.vars.home_url}">
		<div class='ipb-top-left-link'><a href="{ibf.vars.home_url}">{ibf.vars.home_name}</a></div>
	</if>
	<if="{ibf.vars.csite_on}">
		<div class='ipb-top-left-link'><a href="{ibf.script_url}act=home">{ibf.vars.csite_title}</a></div>
	</if>		
	<!--IBF.RULES-->
	<!--ipb.leftlinks.end-->
	<!--ipb.rightlinks.start-->

 

Прошу помощи...уже не знаю что делать

post-13867-1198017042_thumb.jpg

Edited by winterfall

Share this post


Link to post
Share on other sites

<img src='style_images/<#IMG_DIR#>/09.jpg'  'border='0'

Во-первых, не закрыт тег.

 

Вам нужно, чтобы это было на одной полосе?

<div id="logostrip"><a href='{ibf.script_url}'><!--ipb.logo.start--><img src='style_images/<#IMG_DIR#>/logo.png' style='vertical-align:top' alt='Клуб качества' border='0' /><!--ipb.logo.end--></a></div>
<div id="leftmenu"><img src='style_images/<#IMG_DIR#>/09.jpg'  'border='0' 
</div>

То есть логотип и leftmenu ?

Или все, что Вы привели?

В Вашем коде в любом случае сабменю будет ниже.

 

С двумя картинками в стандартном варианте и со стандарным css совсем просто.

Поможет пример с кодом баннера (под 1.x - 2.1.x - у Вас ведь 1.x?).

<div id="logostrip">
<div style="float:right;padding:5px">КОД БАННЕРА</div>
<a href='{ipb.script_url}'><!--ipb.logo.start--><img src='style_images/<#IMG_DIR#>/logo4.gif' style='vertical-align:top' alt='IPB' border='0' /><!--ipb.logo.end--></a>
</div>

Просто переделайте это под свои нужды.

Share this post


Link to post
Share on other sites

Нет, на самом деле вы неправильно поняли проблему, проблема заключается в том что все содержимое которое идет в остальных div,с другим id, идет вниз после div с leftmenu, а нужно, чтобы остальные блоки шли не после leftmenu, а на одном уровне, на скриншоте это видно, то есть все содержимое провалилось вниз...а нужно чтобы оно не уходило так и было просто на одном уровне...то есть вопрос в том, как поставить дивы на один уровен..чтобы выглядело следующим образом:логотип, далее слеваобласть с меню(leftmenu) и соответственно справа должны идти окна с форумом и остальные...помогите пожалуйста.

 

 

Есть еще 2 вопрос, как сделать Закругленные окна с форумами?? не поможите, то есть чтобы они были овальными, как это настроить в css?

Share this post


Link to post
Share on other sites

1. Ищите ошибки в верстке. Другого ответа быть не может, так как, если правильно верстать, ничего никуда не смещается. А по куску выхваченному из кода понять ничего невозможно.

Вижу только ошибку с незакрытым тегом.

 

2. Только в css закругления таблиц не сделать.

html + css + графика

То есть в шаблонах достраиваются дополнительные таблицы, либо перестраиваются существующие, и к углам привязывается "закругленная графика".

Все как в обычной веб-верстке, только с учетом, что трудиться придется с сотнями кусков шаблонов не в Дримвьювере, а в редакторе админки.

Share this post


Link to post
Share on other sites

А вы не поможите с версткой?? За оплату разумеется, напишите пожалуйчта в личку или в аську 212982319

Share this post


Link to post
Share on other sites

У меня совсем нет времени. Тем более, что на IPB верстку уходит времени немерянное количество.

Это иногда основная часть работы по трудозатратам.

На все четко поставленные ясные вопросы отвечу здесь бесплатно.

Только, пожалуйста, вначале разберитесь со структурой шаблонов.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...