Float: вправо сдвигает таблицу влево

#html #css

#HTML #css — код

Вопрос:

Итак, у меня есть несколько разделов на веб-странице, которую я создаю.

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

Под этим ДОЛЖЕН быть стол.

Вместо этого, когда я помещаю div вокруг второй формы и присваиваю ей свойство float: right, вторая форма перемещается справа от таблицы.

Как мне сохранить его в правой части экрана, но НАД соответствующей таблицей?

Комментарии:

1. Возможно, какое-то изображение или код могут помочь.

2. jsfiddle был бы хорош, вы можете редактировать css и html в нем или ссылку на демонстрационную страницу

Ответ №1:

Оберните обе формы в DIV, а затем поместите каждую форму в свой собственный div. Затем сделайте так, чтобы форма, которую вы хотите переместить вправо, была ВЫШЕ другой в разметке.

 <div id='container'>
  <div id='divForm2' style="float:right;">
     <form id='form2' >
  </div>
  <div id='divForm1' >
     <form id='form1' >
  </div>
</div>

<table>
<tr....
 

По сути, элемент перемещается справа от элемента, которому он предшествует.

Ответ №2:

Обязательно очистите свои поплавки.]

 psuedocode:
<div>
  <form1 float: left; />
  <form2 float: right; />
  <br style="clear: both;" />
  <table />
<div>