Image CSS problem

  • (2 Pages)
  • +
  • 1
  • 2

18 Replies - 997 Views - Last Post: 16 June 2009 - 05:07 AM

#1 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Image CSS problem

Posted 16 June 2009 - 03:54 AM

Hi.

I'm trying to fit my own logo (which is larger then the default one), but I can't seem to make the image fit. Here is the CSS:

#hdr {
	background: url('./images/header_back.gif');
	width: 100%;
	height: 200px;
	margin: 0;
	padding: 0; 
}

#logo {
	background: url('./images/header_logo.png');
	width: 258px;
	height: 54px; 
	float: left;
	margin: 5px 25px 0px 25px;
	padding: 0; 
	
}


(the header has
<div id="hdr"><div id="logo"><
for the relevant CSS)

I've tried several things, but without success. All I get is the start of the image, but chopped off. Isn't it enough to alter the size values? (and resize the header_back.gif)

How do I fit my custom image if not, which is 768*183px? (there is enough "space" for the image on the sides, width wise) This should be so easy, which makes it kinda embarrassing to ask for help :P

This post has been edited by Frode789: 16 June 2009 - 03:55 AM


Is This A Good Question/Topic? 0
  • +

Replies To: Image CSS problem

#2 tommyflint  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 34
  • View blog
  • Posts: 679
  • Joined: 24-July 08

Re: Image CSS problem

Posted 16 June 2009 - 04:01 AM

I'm guessing you have tried to alter the height and width within the #logo to fit your custom logo?

Is it possible you could show us the current layout (screenshot or link?)

tommyflint
Was This Post Helpful? 1
  • +
  • -

#3 noorahmad  Icon User is offline

  • Untitled
  • member icon

Reputation: 209
  • View blog
  • Posts: 2,290
  • Joined: 12-March 09

Re: Image CSS problem

Posted 16 June 2009 - 04:03 AM

for image try this:
img {
	height: 100px;
	width: 100px;
}


first insert image in a div then use this code:
#Table_01 #mylogo img {
	height: 100px;
	width: 100px;
}


you are inserting image to background and we have a few properties for background image.


Quote

s it possible you could show us the current layout (screenshot or link?)

Was This Post Helpful? 0
  • +
  • -

#4 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Re: Image CSS problem

Posted 16 June 2009 - 04:09 AM

Here is the link:
http://intoxicated-g...orums/index.php

@ tommy:

Well, it somewhat worked as it did last time I tried to just alter the size. The menu (on the right side) disappears, and the search box is not located on the right place :)

@ noora: I'll try that now.

This post has been edited by Frode789: 16 June 2009 - 04:10 AM

Was This Post Helpful? 0
  • +
  • -

#5 tommyflint  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 34
  • View blog
  • Posts: 679
  • Joined: 24-July 08

Re: Image CSS problem

Posted 16 June 2009 - 04:13 AM

cheers, so currently is the logo saying aion your custom logo?
Was This Post Helpful? 0
  • +
  • -

#6 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Re: Image CSS problem

Posted 16 June 2009 - 04:14 AM

View Posttommyflint, on 16 Jun, 2009 - 03:13 AM, said:

cheers, so currently is the logo saying aion your custom logo?


Yes it is :^:

However, the menu and search box problem is still there.

This post has been edited by Frode789: 16 June 2009 - 04:18 AM

Was This Post Helpful? 0
  • +
  • -

#7 RudiVisser  Icon User is offline

  • .. does not guess solutions
  • member icon

Reputation: 1004
  • View blog
  • Posts: 3,562
  • Joined: 05-June 09

Re: Image CSS problem

Posted 16 June 2009 - 04:18 AM

It seems to work fine for me, what's the actual problem?
Was This Post Helpful? 0
  • +
  • -

#8 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Re: Image CSS problem

Posted 16 June 2009 - 04:20 AM

View PostMageUK, on 16 Jun, 2009 - 03:18 AM, said:

It seems to work fine for me, what's the actual problem?


Menu on the right side disappeared, and the search box is placed in the middle instead of on the right side. (this happened when I got the new logo)
Was This Post Helpful? 0
  • +
  • -

#9 tommyflint  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 34
  • View blog
  • Posts: 679
  • Joined: 24-July 08

Re: Image CSS problem

Posted 16 June 2009 - 04:20 AM

I can't see where the problem is, maybe you could change it back to the orignal logo so we can see what it is meant to look like :)

tommyflint

Edit: Sorry was posting while you two wrote something

This post has been edited by tommyflint: 16 June 2009 - 04:21 AM

Was This Post Helpful? 0
  • +
  • -

#10 noorahmad  Icon User is offline

  • Untitled
  • member icon

Reputation: 209
  • View blog
  • Posts: 2,290
  • Joined: 12-March 09

Re: Image CSS problem

Posted 16 June 2009 - 04:21 AM

or try this:
<style type="text/css">
<!--
#logo img {
	height: 100px;
	width: 200px;
}
#logo {
	height: 100px;
	width: 200px;
}
-->
</style>
</head>
<div id="logo">  <img src="header_logo.png.jpg" width="768" height="183" />
</div>

Was This Post Helpful? 0
  • +
  • -

#11 tommyflint  Icon User is offline

  • D.I.C Addict
  • member icon

Reputation: 34
  • View blog
  • Posts: 679
  • Joined: 24-July 08

Re: Image CSS problem

Posted 16 June 2009 - 04:23 AM

Looks fine to me?

Attached Image

tommyflint
Was This Post Helpful? 0
  • +
  • -

#12 RudiVisser  Icon User is offline

  • .. does not guess solutions
  • member icon

Reputation: 1004
  • View blog
  • Posts: 3,562
  • Joined: 05-June 09

Re: Image CSS problem

Posted 16 June 2009 - 04:24 AM

View PostFrode789, on 16 Jun, 2009 - 03:20 AM, said:

View PostMageUK, on 16 Jun, 2009 - 03:18 AM, said:

It seems to work fine for me, what's the actual problem?


Menu on the right side disappeared, and the search box is placed in the middle instead of on the right side. (this happened when I got the new logo)

No, it works perfectly fine, seriously.

The issue is that your screen isn't big enough. Think about it, you're trying to display a what, 600px logo next to a 600px menu? When they're floated together and your screen isn't at least 1200px, it's gonna start knocking other stuff out. Make your logo smaller.

If you want proof that I'm not lying, look at these:
http://rudivisser.com/notwork.png
http://rudivisser.com/work.png

Your code works fine, get a smaller logo ;)

@noorahmed, I have absolutely no idea what you're trying to acheive but that code is extremely contradictory and I don't see how it would help him at all.

This post has been edited by MageUK: 16 June 2009 - 04:27 AM

Was This Post Helpful? 1
  • +
  • -

#13 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Re: Image CSS problem

Posted 16 June 2009 - 04:27 AM

Oh ok. Thanks :P

I'll try to resize it! :)

This post has been edited by Frode789: 16 June 2009 - 04:28 AM

Was This Post Helpful? 0
  • +
  • -

#14 RudiVisser  Icon User is offline

  • .. does not guess solutions
  • member icon

Reputation: 1004
  • View blog
  • Posts: 3,562
  • Joined: 05-June 09

Re: Image CSS problem

Posted 16 June 2009 - 04:31 AM

Eugh I was just about to quote you and hit refresh instead, noorahmed's code wouldn't have helped, it just resized your logo to a silly size.

Here's what's happening:
Posted Image
Was This Post Helpful? 0
  • +
  • -

#15 Frode789  Icon User is offline

  • D.I.C Head

Reputation: 0
  • View blog
  • Posts: 80
  • Joined: 11-January 08

Re: Image CSS problem

Posted 16 June 2009 - 04:41 AM

Ah I see. Well, I resized it too a much smaller size (400*148), and this is the result:

Does it look ok at you guys? For me the logo is chopped @ the bottom and slightly on the right side.

Posted Image
Was This Post Helpful? 0
  • +
  • -

  • (2 Pages)
  • +
  • 1
  • 2