Primal Posted January 3, 2007 Share Posted January 3, 2007 I am writing a website for a company and I want to put a link to the parent company in the left hand corner and a link to a French version in the other corner. I have tried using the text-align, cellspacing, and cellpadding attributes but they don't do what I want. I would paste a picture but I can't figure out how to upload one. Link to comment Share on other sites More sharing options...
ste Posted January 3, 2007 Share Posted January 3, 2007 can you post either the code or a link to the site? Link to comment Share on other sites More sharing options...
Primal Posted January 3, 2007 Author Share Posted January 3, 2007 I took out the code when I discovered it didn't work, and the website isn't on the Internet yet. It's that new. Link to comment Share on other sites More sharing options...
Xtazy Posted January 3, 2007 Share Posted January 3, 2007 Find you image and get it's code uploading it on www.imageshack.usthen add to the image <right> and </right>...i think...:-? Link to comment Share on other sites More sharing options...
Primal Posted January 4, 2007 Author Share Posted January 4, 2007 click it -> <- Link to comment Share on other sites More sharing options...
jlhaslip Posted January 4, 2007 Share Posted January 4, 2007 PRIMAL,I'm not following the image you posted. I have a page with images on both sides of the header, but I am not certain if it is what you need. Anyway, have a look at this code to see how I have done it on another site. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd"><html> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/> <meta name="Author" content="Jim Haslip, jlhaslip@yahoo.ca"/> <meta name="Keywords" content=""/> <meta name="Description" content=""/> <meta http-equiv="expires" content="0"/><style type="text/css" >body { margin:0; padding:0; background-color: #eecccc; }.left { float:left; margin-left:10em; }.right { float:right; margin-right:10em; }h1 { margin-left:auto; margin-right:auto; text-align:center; padding:0; font-size:3em; }img { margin:0; padding:0; }#content { margin-left:3em; margin-right:3em; background-color: #ee9999; }#footer { margin-left:auto; margin-right:auto; text-align:center; padding:.5em; }hr { width:60%; }.test { margin-top: 1.5em; }.test:first-letter { float:left; font-size: 3em; font-weight: normal; }span { text-transform:uppercase; }#content { margin-left:auto; margin-right:auto; text-align:center; padding:.5em; padding-top:.5em; width:800px;}</style> </head><body><div id="container"><!-- start container div --> <div id="hdr"> <a name="top"></a> <a href="sample.html" class="left" title="left"> <img src="logo.gif" alt="alt title" height="50" width="50"/></a> <a href="sample.html" class="right" title="right"> <img src="logo.gif" alt="alt title" height="50" width="50"/></a> <h1>Heading Here</h1> </div><!-- end hdr div here --> <hr /> <div id="content"><!-- page content starts below this comment --> <!-- Insert page content between the div tags here --> <div class="test" style=" background-color: #cc6666; "><span>This is an example of a DROP-CAP formatting and text-transform:uppercase </span>in the first line of a div. Page content here . <span>Page content</span> here . <span>Page content here</span> . <span>Page</span> content here . <span>Page</span> content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</div> <div class="test" style=" background-color: #cc6666; "> <span>This is an example of a DROP-CAP formatting and text-transform:uppercase </span>in the first line of a div. Page content here . <span>Page content</span> here . <span>Page content here</span> . <span>Page</span> content here . <span>Page</span> content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</div> <div class="test"> <span>This is an example of a DROP-CAP formatting and text-transform:uppercase </span>in the first line of a div. Page content here . <span>Page content</span> here . <span>Page content here</span> . <span>Page</span> content here . <span>Page</span> content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</div> <!-- page content ends above this comment --> </div><!-- end content div --> <hr /> <div id="footer"> <a href="sitemap.html" title="this link goes to the map for the site"> sitemap </a> <a href="mailto:jlhaslip@yahoo.ca?subject=What_Subject"> Web Master </a> Copyright 2004 - 2006. <a href="index.html"> Home Page </a> <a href="#top"> Top of this Page </a> <a href="http://validator.w3.org/check?uri=referer"> valid-xhtml1.0 </a> </div> <!-- end footer div --></div><!-- end container div --></body></html> Float the first one left, the second one right, and centre the text header. This sample also shows drop caps, if you need or want that... Link to comment Share on other sites More sharing options...
Primal Posted January 4, 2007 Author Share Posted January 4, 2007 That's sort of it; it could work but I think I might try to make the whole top line a picture and do an image map of it. I'll try again with the picture. Sorry it's so huge. Link to comment Share on other sites More sharing options...
jlhaslip Posted January 5, 2007 Share Posted January 5, 2007 Play with the margins and paddings to have the spacing you want. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml-strict.dtd"><html> <head> <title></title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/> <meta name="Author" content="Jim Haslip, jlhaslip@yahoo.ca"/> <meta name="Keywords" content=""/> <meta name="Description" content=""/> <meta http-equiv="expires" content="0"/><style type="text/css" >body { margin:0; padding:0; background-color: #eecccc; }.left { float:left; margin-left:1em; }.right { float:right; margin-right:1em; }h1 { margin-left:auto; margin-right:auto; text-align:center; padding:0; font-size:3em; }img { margin:0; padding:0; border-style: none }#content { margin-left:auto; margin-right:auto; text-align:center; padding:.5em; padding-top:.5em; width:750px; background-color: #ee9999; }hr { width:60%; }.test { margin: 1.0em; text-align:left; background-color: #cc6666; }.test:first-letter { float:left; font-size: 3em; font-weight: normal; }span { text-transform:uppercase; }#footer { margin-left:auto; margin-right:auto; text-align:center; padding:.5em; }</style> </head><body><div id="container"><!-- start container div --> <div id="hdr"> <a name="top"></a> <a href="sample.html" class="left" title="left"> <span>The Cybernet Homepage</span></a> <a href="sample.html" class="right" title="right"> <span>Francais Ici</span></a> <h1>Heading Here</h1> </div><!-- end hdr div here --> <hr /> <div id="content"><!-- page content starts below this comment --> <!-- Insert page content between the div tags here --> <div class="test" ><span>This is an example</span> of a 'drop cap' formatting and text-transform:uppercase in the first line of a div. Page content here . <span>Page content</span> here . <span>Page content here</span> . <span>Page</span> content here . <span>Page</span> content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here . Page content here .</div> <!-- page content ends above this comment --> </div><!-- end content div --> <hr /> <div id="footer"> <a href="sitemap.html" title="this link goes to the map for the site"> sitemap </a> <a href="mailto:jlhaslip@yahoo.ca?subject=What_Subject"> Web Master </a> Copyright 2004 - 2006. <a href="index.html"> Home Page </a> <a href="#top"> Top of this Page </a> <a href="http://validator.w3.org/check?uri=referer"> valid-xhtml1.0 </a> </div> <!-- end footer div --></div><!-- end container div --></body></html> Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now