Jump to content

dabwm

Members
  • Posts

    10
  • Joined

  • Last visited

About dabwm

  • Birthday 06/13/1992

dabwm's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. This issue just popped up again on another of my projects and it's seriously dumbfounded me. I have no idea what the issue is. I gave the above (and my current site) a scan over and all divs are properly ended. What am I missing guys?
  2. Hate to bump but that didn't work. Any ideas people?
  3. No solution as of yet. Here's the code: <!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>Run Services Limited</title><link href="css/style.css" media="screen,projection,tv" rel="stylesheet" type="text/css" /></head><body><div class="outer"><div id="header"> <img src="images/logo.png" alt="" id="logo" /> <img src="images/headtext.png" alt="" id="headtext" /> <img src="images/headeffect.png" alt="" id="headeffect" /> <div id="nav"> <ul id="navoptions"> <li class="home"><a href="index.html"></a></li> <li class="ourservices"><a href="#"></a></li> <li class="projects"><a href="#"></a></li> <li class="latestnews"><a href="#"></a></li> <li class="contactus"><a href="#"></a></li> <li class="runvision"><a href="#"></a></li> <li class="downloads"><a href="#"></a></li> <li class="clients"><a href="#"></a></li> <li class="community" ><a href="#"></a></li> </ul> </div></div><div id="main"> <div id="box1"> <div id="boxtitle"> Box 1 </div> <div id="boxcontent"> <div id="column1"> <div id="row"> <a href="#">Link 1</a> </div> <div id="row"> <a href="#">Link 2</a> </div> <div id="row"> <a href="#">Link 3</a> </div> <div id="row"> <a href="#">Link 4</a> </div> <div id="row"> <a href="#">Link 5</a> </div> </div> <div id="column2"> <img style="padding: 1px" src="images/run_building.png" alt="Run_Building.png"> </div> </div> </div> <div id="box2"> <div id="boxtitle"> Box 2 </div> <div id="boxcontent"> <div id="column1"> <div id="row"> <a href="#">Link 1</a> </div> <div id="row"> <a href="#">Link 2</a> </div> <div id="row"> <a href="#">Link 3</a> </div> <div id="row"> <a href="#">Link 4</a> </div> <div id="row"> <a href="#">Link 5</a> </div> </div> <div id="column2"> <img style="padding: 1px" src="images/run_building.png" alt="Run_Building.png"> </div> </div> </div> <div id="box3"> <div id="boxtitle"> Box 3 </div> <div id="boxcontent"> <div id="column1"> <div id="row"> <a href="#">Link 1</a> </div> <div id="row"> <a href="#">Link 2</a> </div> <div id="row"> <a href="#">Link 3</a> </div> <div id="row"> <a href="#">Link 4</a> </div> <div id="row"> <a href="#">Link 5</a> </div> </div> <div id="column2"> <img style="padding: 1px" src="images/run_building.png" alt="Run_Building.png"> </div> </div> </div> <div id="box4"> <div id="boxtitle"> Box 4 </div> <div id="boxcontent"> <div id="column1"> <div id="row"> <a href="#">Link 1</a> </div> <div id="row"> <a href="#">Link 2</a> </div> <div id="row"> <a href="#">Link 3</a> </div> <div id="row"> <a href="#">Link 4</a> </div> <div id="row"> <a href="#">Link 5</a> </div> </div> <div id="column2"> <img style="padding: 1px" src="images/run_building.png" alt="Run_Building.png"> </div> </div> </div> <div id="box5"> <div id="boxtitle"> Box 5 </div> <div id="boxcontent"> <div id="column1"> <div id="row"> <a href="#">Link 1</a> </div> <div id="row"> <a href="#">Link 2</a> </div> <div id="row"> <a href="#">Link 3</a> </div> <div id="row"> <a href="#">Link 4</a> </div> <div id="row"> <a href="#">Link 5</a> </div> </div> <div id="column2"> <img style="padding: 1px" src="images/run_building.png" alt="Run_Building.png"> </div> </div> </div> <div id="content"> <div id="contentb"> <p class="contentbheader">Community Regeneration Specialists</p></br> <p class="contentbtext"><span style="color:#666666; font-weight:bold">RUN Services has quickly grown into a well respected company offering a wide range of community regeneration services to the building industry. We pride ourselves on having the expertise and solutions to achieve the highest expectations of our valued client’s during their community regeneration.</span></br></br> The RUN Group consists of RUN Services, RUN Cleaning Services, RUN Facilities Management, RUN Design Services, RUN Health & Safety Training and RUN Environmental Services. Our services and in house expertise offers a one stop shop which provides our clients with an economical and efficient solution to their urban regeneration requirements.</br></br> RUN Services is a leading specialist in community regeneration work, in particular partnering Local Authorities with their housing facelift schemes, helping to regenerate local communities. We deal with the refurbishment & community regeneration of all elements of the external envelope and also undertake any structural repairs that may be required. We pride ourselves on the fact that we want to regenerate communities, not just houses.</br></br> Our <a href="#" class="contentlinks">Facilties Management</a> and <a href="#" class="contentlinks">Cleaning Services</a> offer a comprehensive building maintenance and cleaning solution to clients, covering everything from concierge and security, to industrial and ladderless window cleaning services.</p> </div> <img class="logo" src="images/logo2.png" style="padding-left: 42px"> <img class="logo" src="images/logo3.png"> <img class="logo" src="images/logo4.png"> <img class="logo" src="images/logo5.png"> </div></div><div id="footer"> <div id="footerb"> <p class="footertext"><span style="color:white; font-size:24px">Run Services Ltd</span></p> <p class="footertext">76 Liverpool Street, Salford, Greater Manchester, M5 4LS</p> <p class="footertext">0800 0113781</p> <p class="footertext">enquiries@runservices.co.uk</p> <p class="footertext" style="margin-left:620px; margin-top:12px;">Web design and SEO by <span style="color:white;">Impression Marketing Ltd</span></p> <div id="footerlinks"> <a href="#" class="footerlinks"><img src="images/facebook.png" class="footerlinks"></a> <a href="#" class="footerlinks"><img src="images/noidea.png" class="footerlinks"></a> <a href="#" class="footerlinks"><img src="images/twitter.png" class="footerlinks"></a> </div> </div></div></div><div id="footereffect"></div></body></html> body {background:url(../images/body.png) repeat-x}body{margin:0;padding:0;vertical-align:baseline}body{width:100%}body{height:1500px}img{border:0;vertical-align:bottom;}li,ul{list-style:none;}li,ul{margin:0; padding:0;}a {text-decoration:none;}a:visited{text-decoration:none;}p{font-family:Arial; padding:0; margin:0;}#row a, #row a:visited{color:#999999;} .outer{width:940px; margin:auto;} #header{height:241px;} #logo{margin-top:66px; margin-left:32px;} #headtext{float:left;margin-top:-49px;margin-left:403px;} #headeffect{margin-top:16px;} #nav{height:40px;} #navoptions{height:40px;} #nav li, #nav li a{float:left; height:40px;} #nav li.home a{background:url(../images/nav_sprite.png)0 0; width:64px;}#nav li.ourservices a{background:url(../images/nav_sprite.png)-64px 0px; width:121px;}#nav li.projects a{background:url(../images/nav_sprite.png)-185px 0px; width:95px;}#nav li.latestnews a{background:url(../images/nav_sprite.png)-280px 0px; width:114px;}#nav li.contactus a{background:url(../images/nav_sprite.png)-394px 0px; width:109px;}#nav li.runvision a{background:url(../images/nav_sprite.png)-503px 0px; width:102px;}#nav li.downloads a{background:url(../images/nav_sprite.png)-605px 0px; width:109px;}#nav li.clients a{background:url(../images/nav_sprite.png)-714px 0px; width:78px;}#nav li.community a{background:url(../images/nav_sprite.png)-792px 0px; width:148px;} #nav li.home a:hover{background-position:0px -40px; width: 64px;}#nav li.ourservices a:hover{background-position:-64px -40px; width:121px;}#nav li.projects a:hover{background-position:-185px -40px; width:95px;}#nav li.latestnews a:hover{background-position:-280px -40px; width:114px;}#nav li.contactus a:hover{background-position:-394px -40px; width:109px;}#nav li.runvision a:hover{background-position:-503px -40px; width:102px;}#nav li.downloads a:hover{background-position:-605px -40px; width:109px;}#nav li.clients a:hover{background-position:-714px -40px; width:78px;}#nav li.community a:hover{background-position:-792px -40px; width:148px;} #main{height:986px;} #footer{height:228px; margin-top:32px;} #footereffect{position:absolute;height:45px;width:100%;top:1227px;background:url(../images/test.png) repeat-x;} #box1{height:156px;width:306px;margin-top:13px;} #box2{height:156px;width:306px;margin-top:13px;} #box3{float:left;height:156px;width:306px;margin-top:13px;} #box4{float:left;height:156px;width:306px;margin-top: 0px;margin-left: 11px;} #box5{float:left;height:156px;width:306px;margin-top: 0px;margin-left: 11px;} #boxtitle{height:29px;background:url(../images/box_title_gradient.png) repeat-x;line-height:28px;padding-left:15px;font-family:Arial;font-size:12px;font-weight:bold;color:white;} #boxcontent{height:126px;border-style:solid;border-width:1px;border-top:0px;border-color:#CCCCCC;} #column1{float:left;height:127px;width:185px;} #column2{float:left;height:127px;width:119px;} #row{height:25px;width:185px;background:url(../images/row_gradient.png) repeat-x;line-height:25px;padding-left:12px;font-family: Arial;font-size:12px;font-weight:bold;} #content{height: 455px;} #contentb{height: 343px;background-color:#F0F0F0;border-style:solid;border-width:1px;border-color:#DDDDDD;margin-top: 195px;} img.logo{margin-top: 12px; margin-left: 100px;} p.contentbheader{padding-top: 10px;padding-left:20px;font-family:Arial;font-size:22px;font-weight:bold;color:#F27F39;} p.contentbtext{font-family:Arial;font-size:13px;color:#999999;padding-left:20px;padding-right:40px;} a.contentlinks{color:#F27F39; text-decoration:underline;}a.contentlinks:hover{color:#F27F39;}a.contentlinks:visited{color:#F27F39;} p.footertext{line-height: 30px;font-family:Arial;font-size:13px;font-weight:bold;color:#999999;} #footerb{padding-top:50px;} #footerlinks{height:101px;width:303px;background-color:#2A2A2A;margin-top:-160px;margin-left:635px; } img.footerlinks{height:60px;width:62px;} a.footerlinks{float:left;display:block;height:60px;width:62px;margin-left:28px;margin-top:19px;}
  4. Correct. All of the elements that are affected (including part of the Nav Bar when zoomed in) are using float:left. Here are the html & css files. https://rapidshare.c...6264/index.html - HTML https://rapidshare.c...57155/style.css - CSS
  5. As the title explains using CTRL + Mousewheel on my website causes havoc with the div placement. If you zoom out by one notch some of the divs fly out of position. Here are some images so you can see what I mean. Apologies for the huge images. If you need me to provide the code let me know.
  6. This is finished. Using div's I've managed to create the desired effect.
  7. I've used a table with some success but that's not entirely standards compliant so I'm trying to dodge that. What exactly do you mean by a container element, a div?
  8. Hello again guys. I'm struggling to create the following using divs and the like. Could someone possibly help me or set down the foundations for it? Note: Would a table work? Or is using tables considered a dated method and a thing of the past nowadays?
  9. I see, thank you, both of you. Besides CSS3 is there way to accommodate gradients without resorting to an image? As you can see in the examples provided the orange 'title bars' do use gradients so I was wondering if I could implement said gradient without an image? Also, how would you two go about creating those boxes? Simple divs with the correct properties applied? Tables? Etc.
  10. Hello everyone, beginner here. I was hoping to gauge some opinion on the best way to create these content boxes. The first image below shows two boxes (and their contents) which I am aiming to create in HTML/CSS. Usually I would set up the appropriate divs, and use images to avoid having to set colours, text font, border weights and the like. Then add anchors, and text as necessary. Is this such a good idea? Should I look to avoid using images and create the same effects (as created in Fireworks) using syntax inside the HTML/CSS? Or should I continue to use images to my hearts content? I know there is no 'correct way' to do this as both systems work, to some degree, but which do you guys think is more efficient, professional and worthwhile? After reading this back I figured it may confuse people so here's the question: To create the two boxes above would you use images, pure HTML/CSS properties to create the boxes, or a mixture of the two? As an example here's what I would usually do for Box 1: I'd create a div and add the image (below), setting the divs height and width properties to those of the image. I would then add the anchors along side the image inside the div and position them using CSS to give the 'Box 1' as on the image above. What do we think? If you need code I'll more than happily provide. Thank you in advance. Edit: I'm asking this as it will apply to all the content boxes I deal with in the future that have a similar layout and so want to streamline how I deal with them.
×
×
  • Create New...