|
HTML - How Do I Make Images Next To Each Other Horizontally?
I need to post images vertically spaced evenly apart. How do I make the images do that?
http://i409.photobucket.com/albums/pp174/Keevu/egg.jpg this is whats wrong theres a bunch of wasted space. Similar TutorialsI need help making a scroll box with images and when you click the image it shows in the center of the screen. I pretty much need this: http://www.satriani.com/2000/about/guitars/ Hi Here is my site; http://www.freewebs.com/jonnibravo/ The icons at the top of the screen are very small, all I want is to make the images bigger when you hover the mouse over them and to have text show below showing what team the icon belongs too. I have tried to find something on the web that shows how to do it but I dont know how to implement the code. The code I am using is below. PHP Code: <p align="center"><img border="0" width="41" src="http://www.freewebs.com/jonnibravo/_41739828_accrington_stanley_203.gif" height="31" style="margin: 8px; width: 41px; height: 31px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_40964115_aldershot_203.gif" height="27" style="margin: 8px; width: 36px; height: 27px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964127_barnet_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img border="0" width="33" src="http://www.freewebs.com/jonnibravo/_42481805_bournemouth_203.gif" height="25" style="margin: 8px; width: 33px; height: 25px" class="fw_image_computer fwSizeProp" /><img border="0" width="55" src="http://www.freewebs.com/jonnibravo/_42453486_bradford_203.gif" height="41" style="margin: 8px; width: 55px; height: 41px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_42484917_brentford_203.gif" height="27" style="margin: 8px; width: 36px; height: 27px" class="fw_image_computer fwSizeProp" /><img border="0" width="38" src="http://www.freewebs.com/jonnibravo/_40964197_bury_203.gif" height="28" style="margin: 8px; width: 38px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="39" src="http://www.freewebs.com/jonnibravo/_44463033_chester_203.gif" height="29" style="margin: 8px; width: 39px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964335_chesterfield_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img border="0" width="37" src="http://www.freewebs.com/jonnibravo/_40964393_dagenham_redbridge_203.gif" height="28" style="margin: 8px; width: 37px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="36" src="http://www.freewebs.com/jonnibravo/_42362464_darlington_203x152.gif" height="26" style="margin: 8px; width: 36px; height: 26px" class="fw_image_computer fwSizeProp" /><img border="0" width="30" src="http://www.freewebs.com/jonnibravo/exeter.jpg" height="26" style="margin: 8px; width: 30px; height: 26px" class="fw_image_computer fwSizeProp" /><img border="0" width="37" src="http://www.freewebs.com/jonnibravo/_40877870_gillingham_203.gif" height="28" style="margin: 8px; width: 37px; height: 28px" class="fw_image_computer fwSizeProp" /><img border="0" width="32" src="http://www.freewebs.com/jonnibravo/_40964281_grimsby_203.gif" height="24" style="margin: 8px; width: 32px; height: 24px" class="fw_image_computer fwSizeProp" /><img class="fw_image_computer fwSizeProp" border="0" width="39" src="http://www.freewebs.com/jonnibravo/lincoln.jpg" height="29" style="margin: 8px; width: 39px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="42" src="http://www.freewebs.com/jonnibravo/_42825829_luton_203.gif" height="31" style="margin: 8px; width: 42px; height: 31px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_44532873_macclesfield_new_203x152.jpg" height="32" style="margin: 8px; width: 44px; height: 32px" class="fw_image_freewebs fwSizeProp" /><img border="0" width="21" src="http://www.freewebs.com/jonnibravo/morcambe.jpg" height="29" style="margin: 8px; width: 21px; height: 29px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_41351579_notts_county2_203.gif" height="33" style="margin: 8px; width: 44px; height: 33px" class="fw_image_computer fwSizeProp" /><img border="0" width="52" src="http://www.freewebs.com/jonnibravo/_44525046_port_vale_226x170.gif" height="39" style="margin: 8px; width: 52px; height: 39px" class="fw_image_computer fwSizeProp" /><img border="0" width="48" src="http://www.freewebs.com/jonnibravo/_43007293_rochdale_203.gif" height="36" style="margin: 8px; width: 48px; height: 36px" class="fw_image_computer fwSizeProp" /><img border="0" width="43" src="http://www.freewebs.com/jonnibravo/_41740022_rotherham_203.gif" height="32" style="margin: 8px; width: 43px; height: 32px" class="fw_image_computer fwSizeProp" /><img border="0" width="31" src="http://www.freewebs.com/jonnibravo/SHREWSBURY.jpg" height="31" style="margin: 8px; width: 31px; height: 31px" class="fw_image_computer fwSizeProp" /><img border="0" width="44" src="http://www.freewebs.com/jonnibravo/_40675862_wycombe_203.gif" height="33" style="margin: 8px; width: 44px; height: 33px" class="fw_image_computer fwSizeProp" /></p> I mean to say that when you make an image and want certain sections of it to link to one page and another section of it to link to another whats the code for this? I've been looking everywhere and can't find it anywhere How do I make a button change images when a user rolls over his/her mouse? Thanks. How do I make a button change images when a user rolls over his/her mouse? Thanks. Hey not even sure if this can be done with html or if i need to use something else but basically i want to make the thumbnails appear where the main image is when they are clicked on instead of opening a new tab like i have it set now. http://whatashirt.com/shirts/swearing_is_caring.html just want stuff under the more photos to appear where the main image is when clicked on Thanks I am working on making a website, and learning as I go. I have been trying to figure out how I would make links and images appear in the same section of many different pages using code. Is this possible in HTML/CSS, which are the only languages I have any experience in. If you need anymore information, let me know and I'll add more details. Is outputting --- Creating linked images < a href= "default.htm"> --- as a line of text next to the image, instead of embedding a link in it. Any ideas what's going on? This is the code: <?xml version = "1.0" encoding = "utf-8"?> <! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict //EN" "http:// www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> Using image as hyperlink </title> </head> <body> <p> Creating linked images < a href= "default.htm"> <img src = "DSC00123.JPG" width = "92" height = "100" alt = Testing out stuff> </img> </a> </p> </body> </head> </html> How do I make images small but when yoiu click them you go to a fullsize version? I have a fullsize image that takes up too much space on my webpage. What code should I use to shrink it a certain percentage but when I click on it you go to a full size image? thanks Ok folks, new dilemma .... I finally got the Flickr code set up inside one of my content boxes, but now the group of images is uneven and for the life of me I can't get them to align in the center of the box. Here is the code (and you can view it on my blog).... <style type="text/css"> /* ------ FLICKR ------ */ .container_flickr { width:225px; height:46px; background-image:url(http://dougcloud.net/show/headflickr.png); } .container_flickr { overflow:hidden; } .sidebar_flickr { width:203px; height:125px; background:#FEF6D2; font-family:Arial, Helvetica, sans-serif; border-width: 0px 1px 1px 1px; border-spacing: 0px; border-style: none solid solid solid; border-color: #4F3314; padding:10px; margin:0 0 20px 0; font-family: 'Trebuchet MS', sans-serif;color: #4F3314; font-size:11px; } div.flickrimg { width: 200px; padding: 3px 3px; } div.flickrimg a { float: left; padding: 0 0 5px 0; margin: 0 5px 0 0; border: none; } div.flickrimg a:hover { border: none; opacity: 1; } div.flickrimg a img { border: 1px solid #4F3314; height: 40px; width: 40px; } div.flickrimg a:hover img { border: 1px solid #ba742a; } #flickrmeta img { padding: 0px 5px 0px 2px; margin: 0; float: none; } </style> <div class="container_flickr"></div> <div class="sidebar_flickr"> <div class="flickrimg"> <script type="text/javascript" src="http://www.flickr.com/badge_code_v2.gne?count=8&display=random&size=s&layout=x&source=user&user=263327 75@N00"></script> </div> <div><span id="flickrmeta"><a href="http://api.flickr.com/services/feeds/photos_public.gne?id=26332775@N00&lang=en-us&format=rss_200" title="My Flickr RSS Feed"><img src="http://dougcloud.net/show/feed-icon-16x16.png" border="0"></a><a href="http://www.flickr.com/photos/26332775@N00/" title="My Flickr Photostream"><img src="http://dougcloud.net/show/morebuttonbrwn.png" border="0"></a></span></div> </div> Any help would be appreciated. Thanks how do i center the body of this page: www.discoveryfilmsuk.com/ i want to align to the middle of the page, vertically and horizontally Below is my code: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <title>One Nice Day</title> </head> <body> <div style="margin:5% 15% 0 15%;border:1px solid black;"> <img style="border:1px solid green" src="http://www.oneniceday.com/Artwork/Notice.gif" alt="[One Nice Day] now contains nudity : photographs and drawings of nude men and women, of which I will be posting on this site solely for the purpose of learning figurative art, in which I am using them as learning references / aids. If you are offended by such images, please click the Back button on your browser." /> </div><br /><br /> <div style="margin:1% 15% 0 15%;font:14pt 'Trebuchet MS',Arial,sans-serif;text-align:center;"> <a href="http://www.oneniceday.com/wordpress/" style="font-weight:bold;">ENTER</a> </div> </body> </html> When I view my web page, the <div> doesn't shrink to fit the size of the image, and there's a huge gap next to the image. U can see the result at www.oneniceday.com How do I center my image horizontally on the page? Thanks! I have no idea why, but the pictures in the table at https://www.wagnermeters.com/california1.php are aligned vertically instead of horizontally as it seems they should be. Am I going crazy? What can I do about it? Hey, well i know alot of people put myspace questions here, and not to be another one of those myspaces i have a question... my myspace url is myspace.com/cherylishot haha dont ask. But on the bottom table i cannot get my links to align left to right, not vertical and in that scroll box. Any help would be appreciated thanks alot! Here's my CSS-code for an item in a list: li { margin: 0em 0em 0em 4em; padding: 2px 0px 0px 2px; font-size: 9pt; } Now when I try to make a sublist, the problem is that the items in the sublist start from the same horizontal position than the items in the "main" list. Anyway to fix this? Should a make a new CSS item but with different margins and padding? How is that going to work since there's only one "li" available? How should I name it then? Hello, I'm using the Lytebox image script and I would like for my images to appear side by side and not vertically. This is the code that I'm using but for some reason it came out kind of odd. Website:http://www.marinaelizabeth.com/2011/...book-1_30.html Quote: <center>Click on images to enlarge and view them as a gallery.</center> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://4.bp.blogspot.com/-kIL2bYltvuY/Tv5ZYiwh_PI/AAAAAAAAAWM/rajrPOgV4ok/s1600/4e8159ba888c8.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://4.bp.blogspot.com/-kIL2bYltvuY/Tv5ZYiwh_PI/AAAAAAAAAWM/rajrPOgV4ok/s1600/4e8159ba888c8.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/-rQua3zWNynw/Tv5HzbTLgxI/AAAAAAAAAUs/Uk6T6DfLBTw/s1600/301041_2223476301499_1085460275_32542139_1266806142_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://1.bp.blogspot.com/-rQua3zWNynw/Tv5HzbTLgxI/AAAAAAAAAUs/Uk6T6DfLBTw/s1600/301041_2223476301499_1085460275_32542139_1266806142_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/-_So5oCwC_zY/Tv5HzNghb7I/AAAAAAAAAUc/4uVJ24oiO6A/s1600/300161_2223481061618_1085460275_32542158_923192763_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://2.bp.blogspot.com/-_So5oCwC_zY/Tv5HzNghb7I/AAAAAAAAAUc/4uVJ24oiO6A/s1600/300161_2223481061618_1085460275_32542158_923192763_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://3.bp.blogspot.com/-NzLeC4jz9vg/Tv5Hy3xv3cI/AAAAAAAAAUQ/3q-062i7e2g/s1600/300161_2223480941615_1085460275_32542155_373340707_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://3.bp.blogspot.com/-NzLeC4jz9vg/Tv5Hy3xv3cI/AAAAAAAAAUQ/3q-062i7e2g/s1600/300161_2223480941615_1085460275_32542155_373340707_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://1.bp.blogspot.com/--K5mxuMSNDA/Tv5HywJFhvI/AAAAAAAAAUI/D5PxnOVYqtc/s1600/300161_2223480901614_1085460275_32542154_1471612777_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://1.bp.blogspot.com/--K5mxuMSNDA/Tv5HywJFhvI/AAAAAAAAAUI/D5PxnOVYqtc/s1600/300161_2223480901614_1085460275_32542154_1471612777_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/-AEljI6VqRXQ/Tv5OS3ta-PI/AAAAAAAAAVc/NOdLmyO4_E4/s1600/311979_2223482901664_1085460275_32542161_509691087_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://2.bp.blogspot.com/-AEljI6VqRXQ/Tv5OS3ta-PI/AAAAAAAAAVc/NOdLmyO4_E4/s1600/311979_2223482901664_1085460275_32542161_509691087_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/-R27iVxEfLbM/Tv5OSf6kt-I/AAAAAAAAAVU/YQmkZr04C6w/s1600/301041_2223476421502_1085460275_32542142_204426155_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://2.bp.blogspot.com/-R27iVxEfLbM/Tv5OSf6kt-I/AAAAAAAAAVU/YQmkZr04C6w/s1600/301041_2223476421502_1085460275_32542142_204426155_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> <br> <a rel="lytebox[groub1]" onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/-qQSPdm60jgQ/Tv5ZY-pmGXI/AAAAAAAAAWU/3F9MxBXbV7M/s200/312657_2223450300849_1085460275_32542123_217211886_n.jpg"><img style="float: left;display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;width: 100px; height: 100px;" src="http://2.bp.blogspot.com/-qQSPdm60jgQ/Tv5ZY-pmGXI/AAAAAAAAAWU/3F9MxBXbV7M/s200/312657_2223450300849_1085460275_32542123_217211886_n.jpg" border="0" alt=""id="BLOGGER_PHOTO_ID_5406207422236379378" /></a> Thanks in advance please help me guys!!! im trying to find a html code that allows people download a pdf files from the website that im trying to make..anyone out there help me.. website below. what is used to make the man on the right come out and talk. Did they take a video and embedd it? TIA http://thiscityisgoingonadiet.com/Default.aspx Hey, Whats the html coding i need to use to create a box like what is displayed on this page, where the html code is written: http://www.myweddingfavors.com/linktous.html Just under where it says "You can copy and paste the code below:" Thanks in advance. I tried making this template, but it doesnt work, it wont unzip, there are no files in it. if anyone can make this for me and give me the code, that would be great. http://myfreetemplatehome.com/free_t...tails-159.html |
|||||||