Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Member
    Join Date
    Feb 2009
    Location
    Ummm do I know you?
    Posts
    36
    Member #
    18253
    Hi I am creating a little website and i have sliced the yellow surround as you can see into 4 topleft, topright, bottomleft, bottomright. Only problem is I now want to put images into those 2 bottom divs but it wont let me here is the code for HTML:
    HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>John Pooley Abstract Artist</title>
    <style type="text/css">
    <!--
    body {
    	background-image: url(images/bg2.jpg);
    	background-repeat: repeat;
    }
    -->
    </style>
    <link href="css/layout.css" rel="stylesheet" type="text/css" />
    </head>
    
    <body>
    <div id="wrapper">
      <div id="topleftsurround"><img src="images/topleftsurround.gif" width="55" height="411" /></div>
      <div id="toprightsurround"><img src="images/toprightsurround.gif" width="177" height="411" /></div>
      <div id="bottomleftsurround"><img src="images/bottomleftsurround.gif" width="500" height="239" /></div>
      <div id="bottomrightsurround"><img src="images/bottomrightsurround.gif" width="500" height="239" />
      <div class="faq"><img src="images/faq.gif" width="155" height="60" alt="FAQ" /></div>
      </div>
    </div>
    </div>
    </body>
    </html>
    
    And the code for the CSS:
    * {
    	margin: 0px;
    	padding: 0px;
    }
    #wrapper {
    	width: 1000px;
    	margin-right: auto;
    	margin-left: auto;
    	border-top-width: 0px;
    	border-right-width: 0px;
    	border-bottom-width: 0px;
    	border-left-width: 0px;
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;
    	background-image: url(../images/bg.jpg);
    	background-repeat: repeat-x;
    	height: 650px;
    	padding: 0px;
    	margin-top: 0px;
    	margin-bottom: 0px;
    }
    a img {
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;
    }
    #wrapper #topleftsurround img {
    	margin: 0px;
    	padding: 0px;
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;
    	float: left;
    }
    #wrapper #toprightsurround img {
    	border-top-style: none;
    	border-right-style: none;
    	border-bottom-style: none;
    	border-left-style: none;
    	float: right;
    }
    #wrapper #bottomleftsurround img {
    	float: left;
    	clear: left;
    }
    #wrapper #bottomrightsurround img {
    	clear: right;
    	z-index: 0;
    	height: 239px;
    	width: 500px;
    	float: right;
    }
    #wrapper #bottomrightsurround .faq img {
    	z-index: 1;
    	float: none;
    	height: 60px;
    	width: 155px;
    	margin-top: 490px;
    	margin-left: 710px;
    }
    So what I am trying to do is fit a small image as a link into the bottom left div using floats, that maybe what I am doing wrong,

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,693
    Member #
    5580
    Liked
    717 times
    We need to see the site "live" online ...
    because we don't have all of the graphics that you are displaying,
    and it might look different with different browsers.



Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 07:20 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com