Using CSS, lists and images

HTML & CSS
1

Hello,

I am trying to achieve the following layout (please, see gallery.jpeg attached) using lightbox and css, however, the following happens:

  1. when I click www.LINK_1.com and www.LINK_1.com, Header 2 (below those links) gets pushed to the left side.

2.when I click www.LINK_4.com and www.LINK_5.com, they push images and links further down.

I was wondering if it is possible to layout this page so images and links don’t move when clicked.

Layout image, html and css file are attached for your convenience.

Thank you

2

What you describe doesn’t happen with the code you supplied—but certainly, nothing should move. Could you past a live example of this so we can test it online?

3

http://buildingsite.atspace.cc/

4

In your css on lines 280 and 281, delete the change of font-size:


.subscribe a:link, a:visited, a:active {color:#336633;[COLOR="#FF0000"]font-size: 1.1em;[/COLOR]}
.subscribe a:hover {color:#336633;background-color:#CEDACE;[COLOR="#FF0000"]font-size: 1.1em;[/COLOR]}
5

I guess this rule was in conflict with the previous one

a.pagelink, a.pagelink:visited, a.pagelink:active {color:#336633;}
a.pagelink:hover {color:#336633;background-color:#CEDACE;}

as well as navigation font size…

It works now.

6

Glad it’s working. Thanks for the feedback.

7

Thanks for catching this one for me, ronpat

Thanks for your time,ralph.m