Cómo mostrar dos div en HTML en línea recta

Método 1: aplicando div {display: bloque en línea} en ambos div

Método 2: aplicando div {float: left;}

Método 3: aplicando ancho en div o su clase o id y usa float: left

Gracias y Saludos,

Shara Jones

Pattronize InfoTech

Interactive Website Design Company India / Servicio profesional de diseño web

Consejo profesional: intente hacer este tipo de preguntas en Stack Overflow, comunidad de preguntas para desarrolladores, pero antes de ir allí, estudie los conceptos básicos de html y css de cualquier curso de aprendizaje en línea como Introducción a HTML o de codeacademy.
No te preocupes, es muy fácil. Todo lo mejor ! Mantener la codificación.

Ya hay una serie de buenas respuestas.

Puede utilizar la propiedad de visualización CSS en línea O en bloque en línea para lograr esto.

NOTA: Estrictamente hablando, no estoy seguro si puedes hacer esto usando HTML. Sin embargo, CSS es compatible con muchas versiones (incluidas las modernas) de HTML.

El código está abajo:

& nbsp;

Es mejor usar el sistema de cuadrícula bootstrap. En este sistema, puede colocar dos etiquetas div dentro de un solo div como dos columnas dentro de una sola fila.

Para obtener más detalles, visite Bootstrap · El marco front-end más popular del mundo para dispositivos móviles y receptivos.

puedes usar el atributo float usando css para alinear tus divs.
por ejemplo :

#home {float: left;}

#homeright {float: right;}

y con bootstap es bastante más fácil
simplemente revise el sistema de cuadrícula bootstrap y solo agregando clases integradas lo logrará.

Es muy simple

Hay 2 formas efectivas:

1. Dar estilo en línea y establecer la propiedad de visualización , pantalla: en línea
2. Simplemente puede establecer el ancho de los divs y establecer el margen izquierdo para el primer div y el margen derecho para el segundo

Depende completamente del ancho de tus dos divs. Puede usar el bloqueo en línea como otros sugieren o usar flotante: dejar en el estilo en línea para hacer dos divisiones en línea recta (suponiendo divisiones con ancho (0-50%) – (0-50%))

display: flex Una guía completa de Flexbox | CSS-Tricks

Ver este ejemplo – Diseño CSS – bloque en línea

Aplique el flotador de estilo CSS a la izquierda del primer div