Divs floating when they shouldn't!

HTML & CSS
1

Hi

I’m trying to adapt an old page to some of the responsive code of a new one. I know it is all a big mess but I want to do it step by step, and latwer wirll change many other things

My problem right now is that I can’t manage the first step…

I cannot understand why the #left (and the rest following) does not sit nicelu under the header. there are no floats to upset the table, and in any case I placed a clear:both just after the navbar.

And the other thing is that I do not understand why the sidebars do not extend automatically when I press the “Read more” at the very bottom of the central column which expands the text.

If you could help get past this first step…

The test page is here http://pintotours.net/AAA/NewTest.html

Thank you.

2

Start by removing display: table; from #container.

3

Hi ralph

Magic!..

But where is my #right?

4

It’s empty at the moment.

5

Ahhh

How can I get it to show as in my published index page? http://pintotours.net

What I’m trying to do, gradually, is to get the page to use tables so that I can do away with fixed heights, but both columns must show even if the #right is purely decorative.

In my other pages, e.g. http://pintotours.net/Europe/Spain/airportBcn.html the #right continues to show even after media queries kick in and the #right becomes empty.

6

Personally, I wouldn’t have an empty element like that just for a presentational effect. But even if you do, using display: table-cell you’d need to place it after the middle column in the HTML.

Instead of a div, though, I’d use the ::after pseudo element on the center column.

7

Hi

  • #right moved in the html but still same result.

Now, pseudo elements are a new concept to me…could you be more specific, please?

Thanks

PS - the whole center column is going to be redesigned. My main interest now is to get both sidebars to move in tandem with the center-colums anf for the whole page to be responsive.

Once I achieve that I will delete the whole center column and start again.

8

LATER

Please, ignore the current thread. I decided to do it the way way roundm using an existing page rather than altering this one, and I alreday have (I think…) the page working with the sidebars

I expect I will be back once I start on the central column…

Many thnaks and sorry to mess around (as usual…)

1 Like
9

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.