Text overflow from container

1

Hi,

I’m working on my tribute page at the moment and need a little help. On a large screen the page displays as it should but if I make the window small the text I have under the big main image overflows from the container-fluid grid section it should stay in. I have tried a bunch of ways but nothing has worked yet.

If someone can take a look and help that would be great and much appreciated.
http://codepen.io/Rob100/pen/rLYEWx

Thanks,

R

2

something like this?

html {
box-sizing: border-box;
}
*, *:before, *:after {
box-sizing: inherit;
}

``http://codepen.io/erretres/pen/bZvjXz

@media (min-width: 768px){
.jumbotron p {
font-size: 5px;
}
}

3

Hi,

I ran the pen from the link you posted and there was the same overflow problem with the text under the main photo.

Was I meant to make additional changes?

Thanks,

R

4

yes, i think that maybe is a good idea add a media querie. I’m testing some media querie now :slight_smile:

5

Hi,

I had a look at media queries and I am not sure how to use them yet.

How do you do that?

Thanks,

R

6

Hi,

I have added a media query and the overflow has stopped.

How do I keep the bullet points in the about Dame Stephanie “Steve” Shirley section centred?

When the page is small. They are almost central but they appear to be not as central as the heading above which says About Dame Stephanie “Steve” Shirley.
http://codepen.io/Rob100/pen/rLYEWx

Thanks,

R

8

Hi,

Here is a screenshot of how the bullet points look off centre in relation to the heading About Dame Stephanie “Steve” Shirley. It displayed correctly on my phone though. Any ideas why it is different at a small size on the computer?

9

Hey,

Anyone have any ideas how to solve the issue in my post previous to this one?

Thanks,

R

10

Hi,

Anyone have any ideas?

Thanks,

R