Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

Geek Culture / Advanced-ish CSS Question

Author
Message
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 7th Jan 2007 21:49
Link
I know this isn't strictly the best place to post this, but I've seen quite a lot of HTML/CSS related chat in here, so I decided to post it here.

I'm working on coding up a design, which is going fairly well: http://www.devhat.org/site/

(I know it doesn't work too well in IE, this is a transparency issue because I'm using PNGs, I'll convert later)

The problem is the width. The site scales, but there's a problem there with the logo image and the slogan holder part beside it. The reason for this is that the logo is a fixed pixel value, and the holder is a percentage value so it will scale.
Because of this, I can't make it so that the combined size is always 100% unless I make the image a % width aswell.
Now I know there's a workaround, as I've had this problem before, but can't remember how I did it.

Any help would be greatly appreciated

Cheers,
Kentaree

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Phaelax
DBPro Master
21
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 7th Jan 2007 22:27
Link
This is why I still prefer tables.

For the IE transparency issue: alpha image loader

Back to top
Profile PM Email Website
Steve J
18
Years of Service
User Offline
Joined: 22nd Apr 2006
Location: Vancouver, Washington
Posted: 7th Jan 2007 22:41
Link
Hmm, i dont really understand what your saying, could you explain a bit more.

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 7th Jan 2007 23:14
Link
@Phaelax: I like my websites XHTML compatible

@SteveJ: If you check the link, you'll see the Devhat logo, and beside it is the slogan and the container. You'll notice the container doesnt end at the width of the browser, but beyond it. That's the problem, I'm trying to get it to scale properly

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Steve J
18
Years of Service
User Offline
Joined: 22nd Apr 2006
Location: Vancouver, Washington
Posted: 7th Jan 2007 23:38 Edited at: 7th Jan 2007 23:44
Link
Hmm, I have had this problem before, but I dont remember how I fixed it, let me go through my old source code.

edit: Cant find it sorry =/.

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 8th Jan 2007 00:02
Link
Phaelax, you're my hero! I fixed it, by setting the enclosing div to display:table.

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Steve J
18
Years of Service
User Offline
Joined: 22nd Apr 2006
Location: Vancouver, Washington
Posted: 8th Jan 2007 00:07
Link
wow, that seems like a simple fix, lol!

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 8th Jan 2007 00:10
Link
No, I lied, didn't work after all, I'd changed something somewhere else, and it had done something that look like it worked but really didn't

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Phaelax
DBPro Master
21
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 8th Jan 2007 06:29
Link
How's this work out? (very very ugly in IE, so use FF)
http://cca-software.com/devhat/

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 8th Jan 2007 10:56 Edited at: 8th Jan 2007 10:57
Link
Very nice! Are those different graphics than you sent me btw? The bottom border and the tabs look different

It is cheating a bit though, damn, why hadn't I thought of that?

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Phaelax
DBPro Master
21
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 8th Jan 2007 16:16
Link
nope, i cut those images out of the same psd file I sent you.

I think the only problem in IE is the relative positioning. Safari displays it almost identically to FF, except for one minor box that displays around the text in the tabs. (probably an easy fix)

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 8th Jan 2007 16:52
Link
Hmm, probably to do with me using Gimp rather than photoshop. I can't check out the compatibility issues, cos I'm running IE7 here

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Josh
21
Years of Service
User Offline
Joined: 7th Dec 2002
Location: Pompey, Great Britain =D
Posted: 8th Jan 2007 18:06 Edited at: 8th Jan 2007 18:12
Link
@ Kentaree:

As your website is limited to a certain group of people (e.g. coders), you can limit the browsers you support as most coders will use the following browsers. I suggest going for IE 7 and FF 2+ as these are the easiest browsers to get to display the same layout. Trying to support more than 2 browsers or versions is an utter nightmare.

I have created Coders Turf so that it supports FF 1.0+ and IE 6/7. It supports IE 6 minus one or two things.


If you were creating a commercial website however, its essential that you support IE 5+ and FF 1+ in the least. Which means no flashy features such as CSS because IE <7 won't like them.

Back to top
Profile PM Email Website
Kentaree
22
Years of Service
User Offline
Joined: 5th Oct 2002
Location: Clonmel, Ireland
Posted: 8th Jan 2007 18:23
Link
I'm trying to get as wide a range of browsers as possible, it just looks bad especially if it's a developer site if the site breaks

Nephin Games
Devhat Developer Network and IRC Channel
Back to top
Profile PM Email Website
Phaelax
DBPro Master
21
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 9th Jan 2007 07:28
Link
I still use IE6 as my main browser, and I can't get IE7 cause I run Win2k.

I wish spidahost's login page for the controlpanel would work in IE.


I'm pretty sure I could get my layout to appear the same in IE6 by using absolute positioning.

Back to top
Profile PM Email Website
Back to top

Login to post a reply

Server time is: 2024-11-18 03:43:44
Your offset time is: 2024-11-18 03:43:44