Como quitar saltos de línea?

[jlbarros100]

Estoy apenas aprendiendo CSS. Supuestamente permite mayor control sobre el posicionamiento de elementos, sin embargo hasta ahora no he podido hacer algo simple. Tengo la siguiente estructura básica:

<div id=container>
<div id=header>
<p id=location>localizacion del documento</p>
<h1>titulo 1</h1>
<h2>titulo2</h2>
</div>
</div>

Deseo que no exista salto de línea entre p, h1 y h2, pero no he podido lograrlo. Ni usando span, ni padding, ni margin, ni line-height.

¿Cómo se debe enfocar esto? No quiero cambiar nada del HTML (se supone que con CSS no es necesario), pero si tengo que hacerlo, ok.

Espero que alguien me pueda ayudar,

Gracias

[JavierB]

Hola jlbarros100. Bienvenido al foro.

Prueba con esto:

<style type="text/css">
p,h1,h2 {margin:0}
</style>

Saludos,

[KnowDemon]

Hola,

Realmente te refieres a que el salto de línea se simple. Porque eso de que no haya salto de línea significa que todos estén en la misma línea (que también se puede hacer).

Te recomiendo que estudies el modelo de cajas de CSS.

Los grandes saltos de línea que presentan los títulos y los párrafos son comportamientos predefinidos por los navegadores que pueden ser sobreescritos con CSS.

Manual de CSS:
http://www.sidar.org/recur/desdi/mcss/index.php

[jlbarros100]

Efectivamente, me refiero a que el salto de línea, que por defecto es doble, sea simple. Pensé que era algo simple de hacer...

Lo siento JavierB, pero margin: 0; no funciona.

Y en cuanto a estudiar más acerca de cajas en CSS, no se si KnowDemon se refiere al manejo de capas. Ya he estudiado este tema y no he encontrado respuesta a un problema que hubiera resuelto facilmente en HTML utilizando tablas.

En todo caso agradezco las respuestas...

JL

[JavierB]

Iniciado por jlbarros100

Lo siento JavierB, pero margin: 0; no funciona.

Acabo de probarlo con Internet Explorer 6.0 y Firefox 1.4 y me ha funcionado bien

Saludos,

[KnowDemon]

Podríamos decir que todos los elementos en bloque son capas (incluyendo los párrafos o los títulos), aunque cada uno tiene estilos predefinidos diferentes.

La solución que propone JavierB debería funcionar. Tal vez aplicas otros estilos depúes o no se están aplicando correctamente.

Si pudieramos ver la página sería más fácil poder ayudarte.

[jlbarros100]

Ya encontré la causa del problema gracias a sus recomendaciones. Como ustedes pensaban, tenía un margin definido en la capa header. Lo quité y coloqué el margin en 0 en h1, h2, y p y ahora sí funcionó.

Muchas gracias!!