Jump to content

Moving an image?

eduard

By eduard
in HTML/XHTML

Recommended Posts

eduard Devoted Member

eduard

Posted
Posted

How do I get the image (database) next to the buttons of the links of the 2 nd division of the homepage of my website (www.eduardlid.com)?

Link to comment
Share on other sites
ste Member

ste

Posted
Posted

put the links in a div and float it, next float the image e.g.HTML

<div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" id="dbimg" alt="img database" >

CSS

div.menulinks {float: left; width: 300px;}#dbimg {float: left; width: 320px;height: 256px;}

Link to comment
Share on other sites
eduard Devoted Member

eduard

Posted
  • Author
Posted
put the links in a div and float it, next float the image e.g.HTML
<div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" id="dbimg" alt="img database" >

CSS

div.menulinks {float: left; width: 300px;}#dbimg {float: left; width: 320px;height: 256px;}

Thanks very much!
Link to comment
Share on other sites
eduard Devoted Member

eduard

Posted
  • Author
Posted
put the links in a div and float it, next float the image e.g.HTML
<div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" id="dbimg" alt="img database" >

CSS

div.menulinks {float: left; width: 300px;}#dbimg {float: left; width: 320px;height: 256px;}

Unfornately, I don´t get it:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div id="header"><a href="http://www.viadeo.com/es/profile/eduard.lid">Profile</a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)(bases de datos)</h4></b></a></div><div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" alt="img database" <img src="images/me.JPG" alt="Eduard Lid" align="right" width="320" height="256"></p></div><div id="footer"><p><h4>Eduard Lid</h4></p></div></body></HTML>*{ margin:0px; padding:0px; }a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:120px;height:30%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}#header{border-style:solid;border-width:5px;border-color:#808080;content:100%;background-color:#6495ED;height:12em;}#content{height:16em;background-color:#EOFFFF;color:red;div.menulinks{float:left;width:300px;}#dbimg{float:left;width:320px;height:256px}#footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;height:14em;font-family:Arial,Helvetica,sans-serif;line-height:90%;text-align:center;font-size:40px;color:#000000;}
Link to comment
Share on other sites
ste Member

ste

Posted
Posted
<div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" alt="img database" <img src="images/me.JPG" alt="Eduard Lid" align="right" width="320" height="256"></p>
The tag for database.jpg needs to be closed. Next add the id 'dbimg' to that e.g.
<img src="http://www.aquaculture.ugent.be/_img/database.jpg" alt="img database" id="dbimg">
The CSS for dbimg is already in your CSS
Link to comment
Share on other sites
eduard Devoted Member

eduard

Posted
  • Author
Posted

I don´t manage to get the database image next to the links of the 2nd division of my homepage!This I´ve got so far:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><HTML><head><meta http-equiv="content-type" content="text/ html; charset=UTF-8"><title>Eduard Lid</title><link rel="stylesheet" type="text/css" href="ex1.css"></head><body><div id="header"><a href="http://www.viadeo.com/es/profile/eduard.lid">Profile</a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer (databases)(bases de datos)</h4></b></a></div><div class="menulinks"><a href="versions/english/database">Database</a><a href="versions/espanol/base_de_datos">Base de datos</a></div><img src="http://www.aquaculture.ugent.be/_img/database.jpg" id="dbimg" alt="img database"><img src="images/me.JPG" alt="Eduard Lid" align="right" width="320" height="256"><div id="footer"><p><h4>Eduard Lid</h4></p></div></body></HTML>*{ margin:0px; padding:0px; }a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:120px;height:30%;text-align:center;padding:2px;}a:hover,a:active{background-color:#000000;}#header{border-style:solid;border-width:5px;border-color:#808080;content:100%;background-color:#6495ED;height:12em;}#contentdiv.menulinks{float:left;width:300px;{height:16em;background-color:#EOFFFF;}#dbimg{float:left;width:320px;height:256px}#footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:5px;height:14em;font-family:Arial,Helvetica,sans-serif;line-height:90%;text-align:center;font-size:40px;color:#000000;}

Link to comment
Share on other sites
JamesB Member

JamesB

Posted
Posted 
#contentdiv.menulinks{float:left;width:300px;{height:16em;background-color:#EOFFFF;}

your css code is not valid, maybe you meant this?

div.menulinks{float:left;width:300px;}div.menulinks a{height:16em;background-color:#EOFFFF;}

also what's "content:100%;"? I don't think the 100% value is supported for the 'content' property - link

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

Go to topic listing
×
×
  • Create New...