2014-02-04 6 views
0

на странице моего сайта свяжитесь с нами есть форма. Мне нужно отобразить адрес в div рядом с правом формы. контактная форма создается с использованием короткого кода wordpress plugin на странице. я писал в одной и той же странице:Как вставить div рядом с html-формой

<div style="float:left;"> 
    hiii 
</div> 

моя форма КСС:

width:455px;border-right:1px solid #000;float:left; 

но отображает его под form.i нарисовали границу-право на форме так, чтобы вертикальная перегородка будет отображаться строка. какие коды css будут использоваться, чтобы сделать div в правой части формы?

+0

вы можете дать ссылку? – franchez

+0

use float: left или display: встроенные свойства CSS. – franchez

+0

проверить эту скрипку http://jsfiddle.net/vDfb9/ – Karuppiah

ответ

0

Я получил этот код с вашей страницы, используя поджигатель.

<div id="FSContact5" style="width:455px;border-right:1px solid #000;float:left;"> 
**<div style="clear:both;"></div>** 
<div style="display:inline;float:right;"> hiii </div> 

вы должны удалить комментируемой DIV, который

**<div style="clear:both;"></div>** 

после тега формы есть DIV, какой стиль определяется ясно: и что поэтому ваш ДИВ ниже в form.Or вы можете установить ясно :никто.

+0

да..анк у друга ... после редактирования ясно: оба очистить: нет. Я получил ответ. thank u – Zammuuz

+0

Вас больше всего приветствует мой друг. – Kaptan

0
<div style="float:left;"> 
    Your form here 
</div> 

<div style="float:right;"> 
    Address goes here 
</div> 
0

Мой совет - не использовать ни поплавки, ни отображение: inline.

Вместо этого используйте дисплей: встроенный: блок. Затем вы можете добавить размеры и маржа/отступы и т.д.

Вот пример:

<style type="text/css"> 
div { 
    display:inline-block; 
    width:45%; 
    vertical-align:top; 
} 
form { 
    display:inline-block; 
    width: 45%; 
    vertical-align:top; 
} 
</style> 

<div>this is on the left</div> 
<form> 
<label>On the Right</label> 
<input type="submit" value="test"> 
</form> 
+0

спасибо .. друг .. – Zammuuz

0

создать внешнее разделение и внутри, что создает два деления. Вставьте свою контактную форму в одно и ваше сообщение в другое подразделение.

<div id="Outer-div"> 
     <div id="inner-left-div"> 
     #contact form 
     </div> 
     <div id="inner-right-div"> 
     #side content 
     </div> 
    </div>  

добавить CSS

#inner-left-div { float:left; display:inline-block;} 
    #inner-right-div { float:right; display:inline-block;} 

здесь отредактированный скрипку http://jsfiddle.net/2U7RS/

Смежные вопросы