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 5 of 5
  1. #1
    Senior Member
    Join Date
    Jan 2014
    Posts
    392
    Member #
    38172
    Liked
    4 times

    has anyone ever?

    i had a list with anchor tags inside it. each li had a class but i wasnt using the classes so i removed them. when i did this the links moved out of position.

    this ever happen to anyone else? it was perfectly positined in the center. ill post the codes, maybe i accidentially deleted something in the css. ive been sifting through it for half an hour but cant spot anything wrong though

    Code:
    <!doctype html>
    <head>
    
    <title> Pratt's of Carlow ltd </title>
    
    <link rel="stylesheet" href="../css/poc.css">
    
    </head>
    
    
    <body>
    
    <div class="wrapper">
    
    	<div class="topbanner">
    		<ul>
    		    <li class="fiat"><a href="#"> </a>
    		    <li class="fiatpro"><a href="#"> </a>
    		</ul>
    		<h1> Pratts of Carlow ltd </h1>
    		<p> At your service :) </p>
    	</div>
    	<div class="nav">
    		<ul>
    		    <li class="home"> <a href="#"> Home </a> </li>
    		    <li class="forsale"> <a href="#"> For sale </a> </li>
    		    <li class="service"> <a href="#"> Service center </a> </li>
    		    <li class="parts"> <a href="#"> Parts </a> </li>
    		    <li class="awards"> <a href="#"> Awards </a> </li>
    		    <li class="contact"> <a href="#"> Contact </a> </li>
    		</ul>
    	</div>
    	
    	
    
    </div>
    
    </body>
    
    </html>
    ive posted the whole css but the relevant nav bits are at the bottom
    Code:
    
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed, 
    figure, figcaption, footer, header, hgroup, 
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	font-size: 100%;
    	font: inherit;
    	vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure, 
    footer, header, hgroup, menu, nav, section {
    	display: block;
    }
    body {
    	line-height: 1;
    }
    ol, ul {
    	list-style: none;
    }
    blockquote, q {
    	quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
    	content: '';
    	content: none;
    }
    table {
    	border-collapse: collapse;
    	border-spacing: 0;
    }
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    html {
    width: 100%;
    height: 100%;
    background-color: rgb(255,80,80);
    }
    
    body {
    margin: 10px auto;
    width: 1100px;
    height: 640px;
    background-color: white;
    box-shadow: 0px 0px 50px rgb(70,70,70);
    border-radius: 6px;
    }
    
    .wrapper {
    position: relative;
    width: 1100px;
    margin: 0 auto;
    }
    
    .topbanner{
    width: 100%;
    height: 70px;
    }
    
    ul {
    display: inline-block;
    margin: 0 auto;
    list-style-type: none;
    text-decoration: none;
    }
    
    a {
    text-decoration: none;
    list-style-type: none;
    }
    
    
    .fiat a {
    position: absolute;
    left: 20px;
    top: 0px;
    margin: 0 auto;
    box-shadow: 0px 0px 10px rgb(100,0,0);
    background: url("../images/fiat.jpg");
    border-bottom: 1px solid rgb(245,245,245);
    border-right: 1px solid rgb(245,245,245);
    border-left: 1px solid rgb(245,245,245);
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    width:122px;
    height:146px;
    display:inline-block;
    z-index: 2;
    }
    
    .fiat a:hover {
    box-shadow: 0px 0px 14px black;
    }
    
    
    
    .fiatpro a {
    position: absolute;
    right: 20px;
    top: 0px;
    margin: 0 auto;
    box-shadow: 0px 0px 10px rgb(100,0,0);
    background: url("../images/fiat.jpg");
    border-bottom: 1px solid rgb(245,245,245);
    border-right: 1px solid rgb(245,245,245);
    border-left: 1px solid rgb(245,245,245);
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    background: url("../images/fiatpro.jpg");
    width:122px;
    height:146px;
    display:inline-block;
    z-index: 2;
    }
    
    .fiatpro a:hover {
    box-shadow: 0px 0px 14px black;
    }
    
    
    
    
    
    
    h1 {
    margin: 0 auto;
    position: relative;
    top: -15px;
    color: grey;
    text-shadow: 0px 0px 1px grey;
    text-align: center;
    font-size: 40px;
    font-family: helvetica;
    letter-spacing: 3px;
    }
    
    p {
    margin: 0 auto;
    position: relative;
    top: -15px;
    color: rgb(255,170,170);
    text-shadow: 0px 0px 1px rgb(255,170,170);
    letter-spacing: 10px;
    text-align: center;
    font-family: helvetica;
    font-weight: 700;
    font-size: 20px;
    }
    
    a {
    font-size: 14px;
    text-decoration: none;
    font-family: helvetica;
    color: rgb(80,80,80);
    text-shadow: 0px 0px 2px rgb(80,80,80);
    letter-spacing: 2px;
    font-weight: 600;
    text-transform: uppercase;
    }
    
    .nav {
    position: relative;
    top: 15px;
    margin: 0 auto;
    box-shadow: 0px 0px 10px black inset;
    background-color: rgb(255,80,80);
    height: 50px;
    line-height: 50px;
    }
    
    .nav a {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%;
    }
    
    .nav li {
    position: relative;
    margin: 0 auto;
    padding: 0px 25px 0px 25px;
    text-align: center;
    display: inline-block;
    }
    
    .nav a:hover {
    color: rgb(250,250,250);
    text-shadow: 1px 1px 10px black;
    }

  2.  

  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Location
    Cottage Grove, Minnesota
    Posts
    7,786
    Member #
    5580
    Liked
    723 times
    When you sit down at your computer for a session of doing changes, make a copy of all your files in a separate directory. Then go ahead and make changes. If you destroy something beyond repair, you can always go into that other directory and retrieve the original copy.

    It sounds like your diving into your scripts without saving anything and you get to a point where you wreck something and can't get back.


  4. #3
    Senior Member
    Join Date
    Jan 2014
    Posts
    392
    Member #
    38172
    Liked
    4 times
    yeah i need to do that. still cant spot the mistake, i was sure all i changed was in the html.

  5. #4
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,139
    Member #
    27197
    Liked
    959 times
    Your <li> don't have a declared width. Try declaring a width and see if that helps.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  6. #5
    Senior Member
    Join Date
    Jan 2014
    Posts
    392
    Member #
    38172
    Liked
    4 times
    i somehow removed the text align center bit. dunno how


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 12:55 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com