Not logged in. · Lost password · Register
Forum: I NEED HELP!!!!!! › Webdesign Help. RSS
Caption displaying differently on same page?
Reply
Avatar
Reply · Quote Chaos_Corner 2005-08-25, 22:05 #1
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Subject: Caption displaying differently on same page?
Hi all,

Progressing on my new site design I now have a slight problem that I can't see where the error is. I have 2 images on this page both with a caption underneath. In firefox and IE6 the 1st one is rendered with a small gap between it and the image, but the 2nd one does not.

In Opera 8 both captions are flush up against the bottom of the image. AFAIK the code is the same for both.

You will see that I am using CSS divs instead of tables now and can't see where the problem might be.

http://www.lordofchaos.co.uk/sitetests/cssexperiments/newt…

This is just a template that I am going to use for my complete site makeover so want to get it all ok. I do NOT want to use java or js to do anything, though the menus will eventually be converted to an external php script to make updating easier.

Thanks in advance  :roll:
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote carbonize (Administrator) 2005-08-25, 22:19 #2
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
Can you specify which images and text you are on about.

On a different note the side menues are seriously messed up on my IE6 with huge gaps between the items.
C a r b o n i z e
Avatar
Reply · Quote Chaos_Corner 2005-08-25, 23:07 #3
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Hi,

The 2 pics of the Clarendon Hotel (1 b&w and the coloured 1 below it).

Concerning the menus I see the same in IE6 can't work it out atm.
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote Chaos_Corner 2005-08-25, 23:18 #4
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Just had a look at a previous test page http://www.lordofchaos.co.uk/sitetests/cssexperiments/newt… and the menus are ok in IE there so will have to compare and try and see what I have changed.
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote carbonize (Administrator) 2005-08-25, 23:20 #5
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
removing the <br> fixed it in firefox. I'll look more this weekend.
C a r b o n i z e
Avatar
Reply · Quote Chaos_Corner 2005-08-26, 18:07 #6
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Thanks Carbonize, that fixed the caption display problem, couldn't see that when I looked at it  :o

Will keep looking to see what is making the menus display weird.
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote carbonize (Administrator) 2005-08-26, 18:10 #7
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
It only fixes it in Firefox.
C a r b o n i z e
Avatar
Reply · Quote Chaos_Corner 2005-08-27, 00:25 #8
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
I've just had a play around and now see that IE6 shows a gap between the pic and caption for both images now, but at least it's consistant. Firefox now shows none for both, and the same with Opera 8.

The menu rendering was fixed by re-setting the height in #left li, #right li and #left a, #right a.  and making sure that the text for the links don't try and wrap to a 2nd line, though I'm sure it must be possible.

When the menus work ok in IE6 the double height button renders correctly, but not in FF or Opera8.

As far as the css code is concerned, this is my first foray into it and am not all that clued up on the finer points yet. So if the code looks a little over the top, it's because I haven't figured that part of it out yet.

Thanks for looking.
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote carbonize (Administrator) 2005-08-27, 07:32 #9
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
You do seem to have jumped in at the deep end a little on this one.
C a r b o n i z e
Avatar
Reply · Quote carbonize (Administrator) 2005-08-27, 07:38 #10
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
I have some ideas involving the float attribute I'll play with later in work if I get chance. As to the text you could always get cocky and use position:relative; top: -30px; to actually place the text over the images. Just don't specify a background colour.
C a r b o n i z e
Avatar
Reply · Quote Chaos_Corner 2005-08-27, 12:36 #11
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Quote by "carbonize":
You do seem to have jumped in at the deep end a little on this one.

Well it started off that I was just going to use a ready-made template and alter just the content. Then I saw possibilities/problems and started to experiment.

The rest as they say, is history  ;)
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote carbonize (Administrator) 2005-08-27, 12:42 #12
Member since Jan 2004 · 786 posts · Location: Bristol, UK
Group memberships: Administrators, Members
Show profile · Link to this post
I'm at work and only have IE 5.5 on hand. You could try putting the image and text into a div container to seperate them from the text moer and see if that helps.
C a r b o n i z e
Avatar
Reply · Quote Chaos_Corner 2005-09-04, 01:03 #13
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Hi,

AFAIKS it didn't make any difference, well not that I could detect, but there is only a slight difference in the browsers so I can live with that I think.

Still playing about with the menus atm, having a look at the Suckerfish way of doing it, I know I didn't want to use any js but this dosn't use much, so should be ok. Also might go back to a 2 column layout as it will give more space for the main content, so may post again if I get stuck.   :lol:
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote Chaos_Corner 2005-09-06, 00:49 #14
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Me again  ;)

Have updated a lot of things and added to it as well, so if folks would like to check it now and let me know your opinions please.

http://www.lordofchaos.co.uk/sitetests/cssexperiments/newt…

So far it vaildates fully and works ok in Firefox, IE6 and Opera 8, haven't been able to test it in other browsers. Still got more to add but I thought a check would be good now.
Cheers Chaos,
Watch Out Chaos if here :-)
Avatar
Reply · Quote Chaos_Corner 2005-09-08, 03:19 #15
Member since Jun 2005 · 19 posts · Location: Kent, UK
Group memberships: Members
Show profile · Link to this post
Well after a long day, I uploaded a new test template that I hope to use to make my site easier to update and manage in the future.

I hope this one works ok, it seems to so as usual comments/suggestions please. There are a few minor things that I want to add, but I'm seeing 2 of everything now, so time for bed.  =P~  =P~  =P~  

http://www.lordofchaos.co.uk/sitetests/cssexperiments/ccte…
Cheers Chaos,
Watch Out Chaos if here :-)
Close Smaller – Larger + Reply to this post:
Verification code: VeriCode Please note the verification code from the picture into the text field next to it.
Smilies: :lmao: ':)' :hug: :-)) :shrug: :-' :lol: x-( :-x :'( :-o :-{} :-! :-? :"> :-(( B-) ;-) #-( :-# O_o TiT :-zZ :-) ZzZ
Special characters:
Reply

Go to forum
Unclassified NewsBoard 1.6.3 © 2003-6 by Yves Goergen
Page created in 195.1 ms (122.6 ms) · 110 database queries in 21.7 ms
Current time: 2009-01-06, 06:41:11 (UTC +00:00)