Web Hosting CSS & Stylesheet Forums

Add Me

User Name
Password
Go Back   CSS & Stylesheet Forums > CSS Forumz: Main > Style Sheet In General

Welcome to the CSS & Stylesheet Forums forums.

You are currently viewing our boards as a guest which gives you limited access to view most discussions and access our other features. By joining our free community you will have access to post topics, communicate privately with other members (PM), respond to polls, upload content and access many other special features. Registration is fast, simple and absolutely free so please, join our community today!

If you have any problems with the registration process or your account login, please contact contact us.
Tags:



Reply
  #11 (permalink)  
Old 07-02-2008, 11:19 PM
John Hosking
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

Stan The Man wrote:
>
> I have fixed some (hopefully most) of the basic errors and reuploaded to
> http://www.gardenmediaguild.co.uk/awards/index.html
>
> Still can't get those thumbnails to line up horizontally though.
> Changing #pic to 336px only gave me the same vertical lineup of images
> with a new white block to the right, to the full height of the images.


The whiteness comes from #pic { background-color: #ffffff; --.

The width is because the 336 is larger than 110 (but smaller than the
344 it needs to be, as Gus has pointed out).

The persistence of the vertical lineup even in a wider #pic is from the
#pic a.p1, #pic a.p1:visited { display:block; --.

Ditch the display:block, give #pic a larger width, and drop the white
background for #pic and #pic a.p1, #pic a.p1:visited (You might not need
the border on those links, either), and see how it looks. Be sure to
test it with images disabled or missing.

Do continue to work on validation the code, especially where you have
extraneous tags. Gus alluded to a problematic style sheet, which appears
to be referenced but missing.


> I also tried creating three different #pic classes, giving each one a
> relative left position 114px greater than the previous one -- but this
> only moved the second and third images to the right without lifting them
> up to line up with the first image. This also messed up with my hover
> enlargements which displayed on load instead of on hover. (Haven't tried
> the display:none thing yet.)


Try to avoid actually positioning anything, esp. absolutely. It's hard
to do right (and even harder to do right in all cases), for one thing,
but it's rarely necessary, IME.

>
> I have also tried various float options and putting the div inside a
> table row at various sizes, percentages and auto, but nothing works.
>
> Unless you have another brainwave, I may be reduced to combining the
> three thumbnails into a single image and figuring out if I can use image
> maps to reproduce the hover enlargement...


No, no, don't do that. That's too much like work. :-)

>
> Thanks again for your help.


YVW

--
John
Pondering the value of the UIP: http://improve-usenet.org/
Reply With Quote


Sponsored Links
  #12 (permalink)  
Old 07-02-2008, 11:19 PM
BootNic
Guest
 
Posts: n/a
Diggs:
Default OT: Trying to persuade CSS images to line up horizontally

On Mon, 30 Jun 2008 07:02:42 -0400
"Beauregard T. Shagnasty" <a.nony.mous@example.invalid> wrote in:
<g4aegj$n6t$1@registered.motzarella.org>

[snip]
> Using Opera, I have to zoom your page to about 120% in order to read
> the text at my preferred size.

[snip]

I can only hope that you have chosen not to set your minimum font size.



--

BootNic Mon Jun 30, 2008 10:56 pm
The more you find out about the world, the more opportunities there
are to laugh at it.
*Bill Nye*

-----BEGIN PGP SIGNATURE-----
Version: GnuPG v2.0.9 (GNU/Linux)

iEYEARECAAYFAkhpnNkACgkQylMUzZO6jeImJgCfXhKS4l/I3zLIq4mWMhZzbUTG
+R4An0df+5aSPIcm1TKLmUltA0nzL1aa
=eSPK
-----END PGP SIGNATURE-----

Reply With Quote


  #13 (permalink)  
Old 07-02-2008, 11:19 PM
Beauregard T. Shagnasty
Guest
 
Posts: n/a
Diggs:
Default Re: OT: Trying to persuade CSS images to line up horizontally

BootNic wrote:

> "Beauregard T. Shagnasty" wrote:
>> Using Opera, I have to zoom your page to about 120% in order to read
>> the text at my preferred [comfortable] size.

>
> I can only hope that you have chosen not to set your minimum font
> size.


That would be the case. Else how would I know when an author uses
microfonts? <g>

--
-bts
-Friends don't let friends drive Windows
Reply With Quote


  #14 (permalink)  
Old 07-02-2008, 11:19 PM
Stan The Man
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

On 2008-07-01 02:03:55 +0100, John Hosking
<John@DELETE.Hosking.name.INVALID> said:

> Stan The Man wrote:
>>
>> I have fixed some (hopefully most) of the basic errors and reuploaded
>> to http://www.gardenmediaguild.co.uk/awards/index.html
>>
>> Still can't get those thumbnails to line up horizontally though.
>> Changing #pic to 336px only gave me the same vertical lineup of images
>> with a new white block to the right, to the full height of the images.

>
> The whiteness comes from #pic { background-color: #ffffff; --.
>
> The width is because the 336 is larger than 110 (but smaller than the
> 344 it needs to be, as Gus has pointed out).
>
> The persistence of the vertical lineup even in a wider #pic is from the
> #pic a.p1, #pic a.p1:visited { display:block; --.
>
> Ditch the display:block, give #pic a larger width, and drop the white
> background for #pic and #pic a.p1, #pic a.p1:visited (You might not
> need the border on those links, either), and see how it looks. Be sure
> to test it with images disabled or missing.


Eureka! Can't thank you enough for picking this out for me. I have
reuploaded to
http://www.zen86793.zen.co.uk/gmga2008/index.html
and the images are now arrayed horizontally at last... even though the
fix seems to have exposed an extraneous white-filled border below and
behind each image. I can make the fill colour disappear but can't see
where the stroke lines are coming from.

I also seem to have managed to make the fonts in this section display
too small but I think I should be able to find out why. One thing
slowing me down is that my GoLive preview window is a long way from
wysiwyg (all text displays massively oversized thus pushing the right
hand column down to the bottom of the page, so I have to preview every
change in my browser/s window/s.

> Do continue to work on validation the code, especially where you have
> extraneous tags. Gus alluded to a problematic style sheet, which
> appears to be referenced but missing.


Yes, that style sheet came with the template and I think I can dispense
with it. Once I'm sure, I will clean up all references to it. And I
will put it through the validator once I get the page more or less
looking like I want it to.

>> I also tried creating three different #pic classes, giving each one a
>> relative left position 114px greater than the previous one -- but this
>> only moved the second and third images to the right without lifting
>> them up to line up with the first image. This also messed up with my
>> hover enlargements which displayed on load instead of on hover.
>> (Haven't tried the display:none thing yet.)

>
> Try to avoid actually positioning anything, esp. absolutely. It's hard
> to do right (and even harder to do right in all cases), for one thing,
> but it's rarely necessary, IME.


Thanks, I've abandoned that idea.

>> I have also tried various float options and putting the div inside a
>> table row at various sizes, percentages and auto, but nothing works.
>>
>> Unless you have another brainwave, I may be reduced to combining the
>> three thumbnails into a single image and figuring out if I can use
>> image maps to reproduce the hover enlargement...

>
> No, no, don't do that. That's too much like work. :-)


Also abandoned!

Stan


Reply With Quote


  #15 (permalink)  
Old 07-02-2008, 11:19 PM
Stan The Man
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

On 2008-07-01 13:34:24 +0100, Stan The Man <man@pr100.com> said:

> Eureka! Can't thank you enough for picking this out for me. I have
> reuploaded to
> http://www.zen86793.zen.co.uk/gmga2008/index.html
> and the images are now arrayed horizontally at last... even though the
> fix seems to have exposed an extraneous white-filled border below and
> behind each image. I can make the fill colour disappear but can't see
> where the stroke lines are coming from.


Further testing suggests that the extraneous border is
browser-specific. I can see it on MacOs Safari but not on WinXP IE.

Stan

Reply With Quote


  #16 (permalink)  
Old 07-02-2008, 11:19 PM
dorayme
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

In article <486a3040$0$26080$db0fefd9@news.zen.co.uk>,
Stan The Man <man@pr100.com> wrote:

> On 2008-07-01 13:34:24 +0100, Stan The Man <man@pr100.com> said:
>
> > Eureka! Can't thank you enough for picking this out for me. I have
> > reuploaded to
> > http://www.zen86793.zen.co.uk/gmga2008/index.html
> > and the images are now arrayed horizontally at last... even though the
> > fix seems to have exposed an extraneous white-filled border below and
> > behind each image. I can make the fill colour disappear but can't see
> > where the stroke lines are coming from.

>
> Further testing suggests that the extraneous border is
> browser-specific. I can see it on MacOs Safari but not on WinXP IE.
>
> Stan


This layout is a hire wire act. Like some cars I have had held together.
You could

#pic a img {
border: 0;
padding: 0;
margin-bottom: -4px;
--

to get over this "font-size related" particular problem.

but there is other trouble.

--
dorayme
Reply With Quote


  #17 (permalink)  
Old 07-02-2008, 11:19 PM
Stan The Man
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

On 2008-07-02 01:16:53 +0100, dorayme <doraymeRidThis@optusnet.com.au> said:

> In article <486a3040$0$26080$db0fefd9@news.zen.co.uk>,
> Stan The Man <man@pr100.com> wrote:
>
>> On 2008-07-01 13:34:24 +0100, Stan The Man <man@pr100.com> said:
>>
>>> Eureka! Can't thank you enough for picking this out for me. I have
>>> reuploaded to
>>> http://www.zen86793.zen.co.uk/gmga2008/index.html
>>> and the images are now arrayed horizontally at last... even though the
>>> fix seems to have exposed an extraneous white-filled border below and
>>> behind each image. I can make the fill colour disappear but can't see
>>> where the stroke lines are coming from.

>>
>> Further testing suggests that the extraneous border is
>> browser-specific. I can see it on MacOs Safari but not on WinXP IE.
>>
>> Stan

>
> This layout is a hire wire act. Like some cars I have had held together.
> You could
>
> #pic a img {
> border: 0;
> padding: 0;
> margin-bottom: -4px;
> --
>
> to get over this "font-size related" particular problem.


Thanks for the hint. In Safari/Mac, margin-bottom: -4px didn't seem to
do anything; but by also giving padding-bottom -4px, the white bar at
the bottom of each image has gone... albeit still leaving behind a
black stroke from somewhere, but I'll find it.

As you have alluded to, I'm finding this template very difficult to
work with, not least because I don't know what some of the CSS code
does (and there are also plenty of classes in there which aren't used
anywhere) -- plus no doubt I have added my own problems to it. Methinks
I will probably start again from scratch, maybe using just one
stylesheet, but much wiser thanks to the much-appreciated help I've had
here.

Stan

Reply With Quote


  #18 (permalink)  
Old 07-02-2008, 11:19 PM
dorayme
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

In article <486ad68e$0$2930$fa0fcedb@news.zen.co.uk>,
Stan The Man <man@pr100.com> wrote:

> As you have alluded to, I'm finding this template very difficult to
> work with, not least because I don't know what some of the CSS code
> does (and there are also plenty of classes in there which aren't used
> anywhere) -- plus no doubt I have added my own problems to it. Methinks
> I will probably start again from scratch, maybe using just one
> stylesheet, but much wiser thanks to the much-appreciated help I've had
> here.
>


I agree it would be simpler in your case to have just one.

Any template this complicated and hard to troubleshoot and which uses
pixel dimensioned fonts and so on is not a good foundation for your
website page.

You can make this basic look you like (and it is fine by me too!) with
much simpler HTML/CSS.

--
dorayme
Reply With Quote


  #19 (permalink)  
Old 07-02-2008, 11:19 PM
Stan The Man
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

On 2008-07-02 03:48:39 +0100, dorayme <doraymeRidThis@optusnet.com.au> said:

> In article <486ad68e$0$2930$fa0fcedb@news.zen.co.uk>,
> Stan The Man <man@pr100.com> wrote:
>
>> As you have alluded to, I'm finding this template very difficult to
>> work with, not least because I don't know what some of the CSS code
>> does (and there are also plenty of classes in there which aren't used
>> anywhere) -- plus no doubt I have added my own problems to it. Methinks
>> I will probably start again from scratch, maybe using just one
>> stylesheet, but much wiser thanks to the much-appreciated help I've had
>> here.
>>

>
> I agree it would be simpler in your case to have just one.
>
> Any template this complicated and hard to troubleshoot and which uses
> pixel dimensioned fonts and so on is not a good foundation for your
> website page.
>
> You can make this basic look you like (and it is fine by me too!) with
> much simpler HTML/CSS.


Yes, I do like minimalist pages and no, the code is not in the least
minimalist... Could you enlighten me as to why anyone would need more
than one stylesheet unless targeting different media?

Stan

Reply With Quote


  #20 (permalink)  
Old 07-02-2008, 11:19 PM
dorayme
Guest
 
Posts: n/a
Diggs:
Default Re: Trying to persuade CSS images to line up horizontally

In article <486b47b9$0$2929$fa0fcedb@news.zen.co.uk>,
Stan The Man <man@pr100.com> wrote:

> On 2008-07-02 03:48:39 +0100, dorayme <doraymeRidThis@optusnet.com.au> said:
>
> > In article <486ad68e$0$2930$fa0fcedb@news.zen.co.uk>,
> > Stan The Man <man@pr100.com> wrote:
> >
> >> As you have alluded to, I'm finding this template very difficult to
> >> work with, not least because I don't know what some of the CSS code
> >> does (and there are also plenty of classes in there which aren't used
> >> anywhere) -- plus no doubt I have added my own problems to it. Methinks
> >> I will probably start again from scratch, maybe using just one
> >> stylesheet, but much wiser thanks to the much-appreciated help I've had
> >> here.
> >>

> >
> > I agree it would be simpler in your case to have just one.
> >
> > Any template this complicated and hard to troubleshoot and which uses
> > pixel dimensioned fonts and so on is not a good foundation for your
> > website page.
> >
> > You can make this basic look you like (and it is fine by me too!) with
> > much simpler HTML/CSS.

>
> Yes, I do like minimalist pages and no, the code is not in the least
> minimalist... Could you enlighten me as to why anyone would need more
> than one stylesheet unless targeting different media?


Oh, there are no absolute principles on this matter. If you want my
practice, I try to keep to one sheet. I succeed often with small sites.
But now and then it can become so long that I get tired of scrolling and
hive off a major bit of it, for example the css for navigation.
Sometimes on a complicated site, this can involve considerable length.

Other times I have used more than one stylesheet have been for sites
with big sections that need significant separate looks. Here I find a
main sheet that holds all the common things to the site as whole and
then I have separate additional sheets for each big section. These
additional sheets sometimes duplicate each other in a big way. But such
redundancy pays for itself handsomely in my not having to actually find
out what quite is common and what is not among the additional, section
specific sheets.

Yes, of course, in theory you would have all that is common in one
sheet. But theory and practice are different in that theory is never
under time pressure. Theory has a very easy time of it. It sits in a
very comfortable armchair indeed and acts as if there is no end to
tomorrows. <g>

In other words, do what you personally find very convenient. It will be
unlikely, if you do this conscientiously and not in panic or
thoughtlessness, to be something that others will find perfectly
understandable.

--
dorayme
Reply With Quote


Reply


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On


© Camley Interactive (camley.info) 2008 - all logos and images are copywrite their respective owners.
Proud member of the Camley Interactive Network
All times are GMT. The time now is 10:33 PM.
Powered by vBulletin® Version 3.7.3
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.1.0 ©2007, Crawlability, Inc.




Inactive Reminders By Mished.co.uk