---
id: bad87fee1348bd9aede08845
title: Crea un título personalizado
challengeType: 0
forumTopicId: 16816
dashedName: create-a-custom-heading
---
# --description--
Crearemos un título simple para nuestra aplicación de fotos de gatos colocando el título y la imagen relajante del gato en la misma fila.
Recuerda, Bootstrap usa un sistema de cuadrícula responsivo, lo que facilita la colocación de elementos en filas y especifica el ancho relativo de cada elemento. La mayoría de las clases de Bootstrap se pueden aplicar a un elemento `div`.
Anida tu primera imagen y tu elemento `h2` dentro de un solo elemento `
`. Anida tu elemento `h2` dentro de un `
` y tu imagen en un `
` de modo que estén en la misma línea.
¿Observas cómo la imagen ahora tiene el tamaño adecuado para ajustarse al texto?
# --hints--
Tu elemento `h2` y el elemento superior `img` deben estar anidados juntos dentro de un elemento `div` con la clase `row`.
```js
assert($('div.row:has(h2)').length > 0 && $('div.row:has(img)').length > 0);
```
Tu elemento superior `img` debe estar anidado dentro de un `div` con la clase `col-xs-4`.
```js
assert(
$('div.col-xs-4:has(img)').length > 0 &&
$('div.col-xs-4:has(div)').length === 0
);
```
Tu elemento `h2` debe estar anidado dentro de un `div` con la clase `col-xs-8`.
```js
assert(
$('div.col-xs-8:has(h2)').length > 0 &&
$('div.col-xs-8:has(div)').length === 0
);
```
Todos tus elementos `div` deben tener etiquetas de cierre.
```js
assert(
code.match(/<\/div>/g) &&
code.match(/