7 Replies - 1407 Views - Last Post: 16 August 2011 - 10:40 AM

#1 menukadevinda  Icon User is offline

  • D.I.C Regular

Reputation: -7
  • View blog
  • Posts: 470
  • Joined: 14-April 11

hi i need to put css on image

Posted 15 June 2011 - 12:42 AM

hi,

What I need is put css on a image and edit my site. I have design a big image and i need to put div s on that image.

when I try to put div tags on it , Div tags are display after the image....


how to solve this.... is there any possibility to do this?

plz some one help me on this

thx in advance,
Menuka
Is This A Good Question/Topic? 0
  • +

Replies To: hi i need to put css on image

#2 youngone  Icon User is offline

  • D.I.C Head

Reputation: 14
  • View blog
  • Posts: 60
  • Joined: 12-June 11

Re: hi i need to put css on image

Posted 15 June 2011 - 02:20 AM

what are you actually trying to achieve? could you describe your problem more deeply and give us more details about it? a link to your site might help.
what i've understood so far, you're having a large image and want to put a div box on it. maybe you should set the image as a background and position the div box using css then.
http://www.w3schools...positioning.asp
Was This Post Helpful? 1
  • +
  • -

#3 omochan  Icon User is offline

  • D.I.C Head
  • member icon

Reputation: 6
  • View blog
  • Posts: 148
  • Joined: 19-October 06

Re: hi i need to put css on image

Posted 15 June 2011 - 06:22 AM

Posting code would be awesome so we can see what's going on.
Was This Post Helpful? 0
  • +
  • -

#4 menukadevinda  Icon User is offline

  • D.I.C Regular

Reputation: -7
  • View blog
  • Posts: 470
  • Joined: 14-April 11

Re: hi i need to put css on image

Posted 15 June 2011 - 11:15 PM

thx all.

when i set as backgroud-image it worked.
I had set as imgage as <img>

best regards,
menuka

here i got another problem,

i needed to put a div and inside div , I wanted to put 3 coloums using <div> tags and embedded 3 images.

unfortunately, only 2 images are displayed properly. The 3rd one is displayed in the first coloumn. How to fix this.

here is the html coding

<div id="content">
				<h3><a href="#">Vestibulum vel lacus eget</a></h3>
				<div class="box_3col">
					<div class="col1">
						<img src="images/img1.jpg" alt="111" title="" />
					</div>
					<div class="col2">
						<img src="images/img2.jpg" alt="222" title="" />
					</div>
					<div class="col3">
						<img src="images/img3.jpg" alt="333" title="" />
					</div>
					<div class="clear">
					</div>
				</div>
				<h3><a href="#">Vivamus tempor mauris </a></h3>
				<div class="box_3col">
					<div class="col1">
						<p><a href="#">Nunc eget mi id risus tempor rhoncus.</a><br />
						Integer lectus sapien, pulvinar non ornare quis, vulputate vel eros. Cras aliquam quam eget odio accumsan eu lobortis urna mollis. <a href="#">&raquo;</a></p>
					</div>
					<div class="col2">
						<p><a href="#">Aliquam congue nisi quis felis porttitor vestibulum.</a><br />
						Nam eget metus dui, eu consectetur urna. Donec sed mauris quis nisl iaculis. Sed suscipit lobortis massa, imperdiet feugiat ante bibendum et.  <a href="#">&raquo;</a></p>
					</div>
					<div class="col3">
						<p><a href="#">Vivamus tempor mauris at mi convallis tempor. </a><br />
						Ut tellus erat, ultricies sed cursus sit amet, vestibulum vel nibh. Sed suscipit lobortis. Phasellus viverra, lectus a tristique rutrum, ante justo cursus odio <a href="#">&raquo;</a></p>
					</div>
					<div class="clear">
					</div>
				</div>
			</div>




Here is the CSS
.box_3col{
	padding: 15px 0px 15px 0px;
}
.clear{
	clear: both;	
}
.col1, .col2, .col3{
	float: left;
	width: 300px;
	padding: 0px 15px 0px 15px;
}
.col1, .col2, .col3{
	background: url(images/bor_3col.gif) repeat-y left;
}
#content{
	padding-bottom: 20px;
}
.white_box{
	background: #ffffff;
	padding: 15px;
}




please help me to fix this problem

thx
Was This Post Helpful? 0
  • +
  • -

#5 Chrisx18  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 31
  • Joined: 04-January 10

Re: hi i need to put css on image

Posted 22 June 2011 - 12:44 PM

EDIT: sorry I didn;t see that you fixed the problem.

This post has been edited by Chrisx18: 22 June 2011 - 12:45 PM

Was This Post Helpful? 0
  • +
  • -

#6 Lemur  Icon User is offline

  • Pragmatism over Dogma
  • member icon


Reputation: 1381
  • View blog
  • Posts: 3,511
  • Joined: 28-November 09

Re: hi i need to put css on image

Posted 08 July 2011 - 11:39 AM

LEARN HTML and CSS. That doesn't mean use a pre-generated template.

Sites that are one large image, by that you mean a design. Designs need to be sliced in a way that uses the least possible images. It's the job of CSS to cover the placement of these areas and the job of divs to lay out the basic skeleton of the site. What you have is a bad case of divits, or overuse of the div tag.

Effective HTML coding is when you use the least amount of code possible. That means container css classes and ids need to be on the body, nav needs to be on the ul, titles need to be on the h# tags. With the advent of HTML5 most of this has changed but I intend to give it a few years to work out the bugs before I play with it.

As it is you don't have a particularly solid understanding of html and that will haunt you if you don't get it down properly.
Was This Post Helpful? 1
  • +
  • -

#7 menukadevinda  Icon User is offline

  • D.I.C Regular

Reputation: -7
  • View blog
  • Posts: 470
  • Joined: 14-April 11

Re: hi i need to put css on image

Posted 08 July 2011 - 10:28 PM

hi all,

here is the site that i asked ur support.
i have host the first page.
if there is any improment to be done let me know.

www.sahansevena.co.cc

thx in advance,
menuka.
Was This Post Helpful? 0
  • +
  • -

#8 Finney_3  Icon User is offline

  • D.I.C Head

Reputation: 3
  • View blog
  • Posts: 75
  • Joined: 17-April 10

Re: hi i need to put css on image

Posted 16 August 2011 - 10:40 AM

If your looking for advise on your site post in site check. People will look for it in there to help you what they think you can do to improve your website. Best of luck
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1