User Tag List

Thanks Thanks:  0
Likes Likes:  0
Page 1 of 2 12 LastLast
Results 1 to 10 of 14

Thread: Calling on webdesign folks again: This is doing my head in!!!

  1. #1
    Regular Member RSV_Ecosse's Avatar
    Join Date
    Mar 2006
    Location
    Falkirk, Scotland
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default Calling on webdesign folks again: This is doing my head in!!!

    Been working on this site for a client.

    www.glasgowkayakclub.com

    On the left hand side, the Nav bar, the top Nav section "Home" appears to have "jumped" upwards by a few pixels if viewed in I.E. 6.0. This problem is not apparent in I.E. 7.0. Its a niggle, I can live with that, but the more important problem is below:-

    When viewing the "Calendar of Events" and the "Gallery" the content has all dropped to the bottom of the page and the links on the right have shifted across to the left, moving the whole page and throwing it all out of line.

    I'm wondering if its to do with the right or left hand side of the page or where the link images are as it seems to fall on its face and move all the content down when you slowly move the right or left side of the page in and reduce the window size. Just tried it in IE 7.0 as well and when moving the right or left side of the window in, it does the same at a certain point. So I would assume that this points to something wrong with my code rather than a browser compatibility problem?.

    Been tearing my hair out for days trying to find a solution for this.

    Any advice greatly appreciated.
    Last edited by RSV_Ecosse; 16th July 2007 at 20:46.

  2. #2
    On a Sabbatical
    Join Date
    Jun 2005
    Location
    Failsworth, Manchester
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    How have you written the main script matey. I take it you're not using CSS (cascading style sheets), these are great at keeping the same settings on every page and only loading up content.

    Try re-sizing the gallery images and see what effects that has? My view (in I.E.7) is not moving your ad banners left it's only over laying the gallery image. Thus forcing the image below the banners.

  3. #3
    Regular Member BigLad's Avatar
    Join Date
    Feb 2007
    Location
    30,000ft by day, bed at night
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    Well it looks perfectly fine using Firefox, only mad people use I.E.

  4. #4
    Regular Member RSV_Ecosse's Avatar
    Join Date
    Mar 2006
    Location
    Falkirk, Scotland
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    AJA......yep, I'm using CSS. The style.css sheet is as follows:-

    Code:
    body {
    margin: 0 0 0 0;
    background-color: #fff;
    }
    
    a {
    text-decoration: none;
    color: #06f;
    }
    
    a:hover {
    text-decoration: underline;
    color: #06f;
    }
    
    #preload {
    width: 0;
    height: 0;
    display: inline;
    background-image: url('menubg.jpg');
    }
    
    #header {
    width: 100%; height: 150px;
    margin: 0 0 0 0;
    background-color: #3b3b3b;
    vertical-align: bottom;
    z-index: 1;
    }
    
    #header h1 {
    	display: block;
    	position: absolute;
    	margin: 116px 0 0 0;
    	padding: 0;
    	background-color: transparent;
    	color: #fff;
    	font-family: 'trebuchet ms', 'century gothic', verdana, sans-serif;
    	font-size: 35px;
    	font-weight: 400;
    	z-index: 4;
    	top: -43px;
    }
    
    span {
    color: #06f;
    }
    
    #header big {
    float: right;
    margin: 50px 0 0 0; padding: 0;
    color: #444;
    font-family: 'trebuchet ms', 'century gothic', verdana, sans-serif;
    font-size: 100px;
    letter-spacing: -11px;
    }
    
    #menu {
    	position: absolute;
    	top: 108px;
    	width: 100%;
    	height: 118px;
    	margin: 0 0 0 0;
    	background-color: #000;
    	border-top: solid 1px #fff;
    	border-bottom: solid 1px #fff;
    	z-index: 3;
    	text-align: center;
    	left: 0px;
    }
    
    
    #menu ul {
    margin-top: 20px;
    }
    
    #menu ul li {
    display: inline;
    }
    
    #menu ul li a {
    background-color: transparent;
    background-repeat: repeat-x;
    padding: 14px 20px 14px 20px;
    font-size: 0.8em;
    font-family: 'century gothic', verdana, sans-serif;
    color: #666;
    font-weight: bold;
    text-decoration: none;
    border: solid 1px #000;
    }
    
    #menu ul li a:hover {
    background: #06f url('menubg.jpg') repeat-x top;
    color: #fff;
    text-decoration: none;
    border: solid 1px #fff;
    }
    
    #main {
    	position: absolute;
    	top: 205px;
    	width: 100%;
    	background: url('main.jpg') repeat-x top;
    	left: -7px;
    }
    
    #container {
    width: 90%;
    margin: 0 auto;
    padding-top: 50px;
    font-family: arial;
    font-size: 0.9em;
    }
    
    #subnav {
    clear: left;
    float: left;
    width: 140px;
    padding: 0;
    font-size: 0.6em;
    font-family: "Century Gothic";
    }
    
    #subnav ul {	
    list-style: none;
    width: 140px;
    margin: 0 0 20px 0;
    padding: 0;
    font-size: 1.1em;
    }	
    
    #subnav li {
    margin-bottom: 1px;
    }
    
    #subnav li a {
    font-weight: bold;
    height: 20px;
    text-decoration: none;
    color: #cccccc;
    display: block;
    padding: 5px;
    background: #3b3b3b;
    border-right: 10px solid #fff;
    }	
    	
    #subnav li a:hover {
    background: #06f;
    color: #ffffff;
    border-right: 10px solid #06f;
    }
    
    #subnav .child {
    font-size: 0.9em;
    padding: 0;
    }
    
    #subnav .child a {
    height: 14px;
    padding-left: 10px; 
    border-right: 10px solid #fff;
    background: #bbb;
    color: #666;
    }
    
    #subnav .child a:hover {
    color: #06f;
    background-color: #e0e0e0;
    border-right: 10px solid #fff;
    }
    
    #content {
    margin: 0 160px 10px 165px;
    border-right: 1px solid #ccc; padding: 0 20px 0 0;
    line-height: 1.6em;
    color: #666;
    font-size: 0.9em;
    }
    
    #content p {
    padding-bottom: 5px;
    }
    
    h1 {
    margin-top: 0px;
    color: #06f;
    letter-spacing: -2px;
    font-family: 'trebuchet ms', 'century gothic', verdana, sans-serif;
    }
    
    h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    color: #666;
    letter-spacing: -1px;
    font-size: 1.3em; font-weight: 400;
    font-family: 'trebuchet ms', 'century gothic', verdana, sans-serif;
    }
    
    
    .right {
    float: right;
    margin: 0 0 8px 12px;
    padding: 4px;
    background-color: #FFF;
    border: 1px solid #CCC;
    }
    
    #footer {
    padding: 5px;
    margin-top: 50px;
    margin-bottom: 3px;
    color: #aaa;
    font-size: 0.7em;
    text-align: center;
    border-top: 1px solid #ccc;
    }
    
    #extras {
    clear: right;
    float: right;
    width: 140px;
    margin-left: 10px;
    margin-bottom: 20px;
    padding: 0;
    color: #666;
    }
    
    #extras p {
    line-height: 1.5em;
    margin: 0 0 1.5em 0;
    font-size: 0.7em;
    }
    
    #box1 {
    background: #fff url('boxbg.jpg') repeat-x top;
    border: 1px solid #ccc;
    width: 30%;  
    float: left; 
    margin: 0 2px; text-align: left;
    padding: 1px; 
    }
    
    #box2 { 
    background: #fff url('boxbg.jpg') repeat-x top;
    border: 1px solid #ccc;
    margin: 0 auto;
    width: 30%;  text-align: left; 
    padding: 1px;
    }
    
    #box3 { 
    background: #fff url('boxbg.jpg') repeat-x top;
    border: 1px solid #ccc;
    width: 30%; 
    float: right; 
    margin: 0 2px; text-align: left;
    padding: 1px;
    }
    
    
    #box1 h2, #box2 h2, #box3 h2 {
    margin-left: 4px;
    }
    
    .center {
    text-align:center;
    display:block;
    margin-top: 15px;
    }
    
    .box {
    margin: 0 4px 10px 4px;
    line-height: 1.3em;
    font-size: 0.8em;
    border: 0;
    }
    .image-right {
    	margin: 10px;
    }
    .image-right {
    	float: right;
    	margin-bottom: 10px;
    	margin-left: 10px;
    }

    So whats your view in IE 7.0 doing?. Does it look ok?. I will resize the Gallery pics and see what happens. But the same error seems to be happening in the "Calendar of Events" section where there is no Gallery.

    @BigLad....yep....works fine in FF, but I've gotta think of those not using FF, need to get the site working across the rest of the browsers.

  5. #5
    Regular Member Caterman's Avatar
    Join Date
    Aug 2005
    Location
    Here, there and every where!
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    Looks fine in IE7, FF2.0.0.4, Opera 9.20.

  6. #6
    Regular Member VectraV6CDTi's Avatar
    Join Date
    Jun 2005
    Location
    Wilts
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    The Home link is easy....

    Change this line:
    <li><span class="style5"><span class="style6"><a href="index.html">Home</a></span></span></li>

    to this:
    <li class="style7"><a href="index.html">Home</a></li>

    I'll look into the other issue....

  7. #7
    Regular Member RSV_Ecosse's Avatar
    Join Date
    Mar 2006
    Location
    Falkirk, Scotland
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    I cant see that in my coding m8.....where exactly is it?.

    /I'm blind as a bat!!!

  8. #8
    Regular Member VectraV6CDTi's Avatar
    Join Date
    Jun 2005
    Location
    Wilts
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    Right sussed it!!!

    In page Calendar.html you have a table named ID="Table1". Just remove the width from that table.

    Was:

    <table width="703" border="0" ID="Table1">
    <tr>
    <th width="88" scope="col"><p class="style2">Date</p></th>
    <th width="60" scope="col"><p class="style2">Time</p></th>
    <th width="145" scope="col"><p class="style2">Proposed Destination </p></th>
    <th width="148" scope="col"><p class="style2">Expected Level </p></th>
    <th width="90" scope="col"><p class="style2">Responses</p></th>
    <th width="146" scope="col"><p class="style2">Contact</p></th>
    </tr>.........................


    Now should be:

    <table border="0" ID="Table1">
    <tr>
    <th width="88" scope="col"><p class="style2">Date</p></th>
    <th width="60" scope="col"><p class="style2">Time</p></th>
    <th width="145" scope="col"><p class="style2">Proposed Destination </p></th>
    <th width="148" scope="col"><p class="style2">Expected Level </p></th>
    <th width="90" scope="col"><p class="style2">Responses</p></th>
    <th width="146" scope="col"><p class="style2">Contact</p></th>
    </tr>.........................


    Not sure how this will look in other browsers.....

    HTH

  9. #9
    Regular Member VectraV6CDTi's Avatar
    Join Date
    Jun 2005
    Location
    Wilts
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    Quote Originally Posted by RSV_Ecosse View Post
    I cant see that in my coding m8.....where exactly is it?.

    /I'm blind as a bat!!!
    You must be using some kind of Editor? Just search for the word 'Home'

  10. #10
    Regular Member VectraV6CDTi's Avatar
    Join Date
    Jun 2005
    Location
    Wilts
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    StatsVehicle Info
    Post Thanks / Like
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Default

    Quote Originally Posted by VectraV6CDTi View Post
    Right sussed it!!!

    In page Calendar.html you have a table named ID="Table1". Just remove the width from that table.

    Was:

    <table width="703" border="0" ID="Table1">
    <tr>
    <th width="88" scope="col"><p class="style2">Date</p></th>
    <th width="60" scope="col"><p class="style2">Time</p></th>
    <th width="145" scope="col"><p class="style2">Proposed Destination </p></th>
    <th width="148" scope="col"><p class="style2">Expected Level </p></th>
    <th width="90" scope="col"><p class="style2">Responses</p></th>
    <th width="146" scope="col"><p class="style2">Contact</p></th>
    </tr>.........................


    Now should be:

    <table border="0" ID="Table1">
    <tr>
    <th width="88" scope="col"><p class="style2">Date</p></th>
    <th width="60" scope="col"><p class="style2">Time</p></th>
    <th width="145" scope="col"><p class="style2">Proposed Destination </p></th>
    <th width="148" scope="col"><p class="style2">Expected Level </p></th>
    <th width="90" scope="col"><p class="style2">Responses</p></th>
    <th width="146" scope="col"><p class="style2">Contact</p></th>
    </tr>.........................


    Not sure how this will look in other browsers.....

    HTH

    Sorry, I think my Editor put in "Table1". Doh!! Ignore the Table1 bit, but you hopefully be able to reconise the rest of the code. Just search for width="703" and remove it.

    So should be now:

    <table border="0">
    <tr>
    <th width="88" scope="col"><p class="style2">Date</p></th>
    <th width="60" scope="col"><p class="style2">Time</p></th>
    <th width="145" scope="col"><p class="style2">Proposed Destination </p></th>
    <th width="148" scope="col"><p class="style2">Expected Level </p></th>
    <th width="90" scope="col"><p class="style2">Responses</p></th>
    <th width="146" scope="col"><p class="style2">Contact</p></th>
    </tr>.........................

Page 1 of 2 12 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Similar Threads

  1. Gsi ,vx calling
    By noudder72 in forum Engine & Drivetrain
    Replies: 2
    Last Post: 24th April 2011, 19:07
  2. The DMF is calling me,
    By DavieVectd120 in forum Diesel Engine related
    Replies: 10
    Last Post: 11th April 2010, 12:25
  3. Calling Aja
    By andy.l in forum General Chat
    Replies: 6
    Last Post: 14th September 2007, 12:41
  4. Calling AF
    By marichrd in forum Vectra C / Signum Car Chat
    Replies: 0
    Last Post: 9th July 2006, 21:50
  5. Calling ALD.....
    By Big Davie in forum Vectra C / Signum Car Chat
    Replies: 6
    Last Post: 19th May 2006, 14:35

Visitors found this page by searching for:

Nobody landed on this page from a search engine, yet!

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •