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.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 13
  1. #1
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    Hey, I am putting up my DVD collection, I think the world needs to know my collection..

    First problem, one which I have seen before in more complex designs, I have the following code which in FF 2.0 displays a line of text.

    HTML Code:
    	<div id="particularDvd">
    		<div id="dvdTitle"><b>1.</b> <a href="view.php?id=1" title="View Leon">Leon</a>,</div>
    		<div id="dvdCert">(18)</div>
    		<div id="dvdMySay">"..kick *** film, one of my favourite ever endings.."<br /></div>
    	</div>
    CSS Source:
    Code:
    	#particularDvd {
    		width: 100%;
    		padding: 10px;
    		display: inline;
    	}
    	div#dvdTitle {
    		width: 20%;
    		display: inherit;
    		font-style: italic;
    	}
    	div#dvdCert {
    		color: red;
    		width: 5%;
    		display: inherit;
    	}
    	div#dvdmySay {
    		color: #666666;
    		display: inherit;
    		font-weight: bold;
    		font-style: italic;
    	}
    	a:link { 
    		font-size: 10px;
    		color: black;
    	}
    	a:visited {
    		color: green;
    	}
    	a:active {
    		color: blue;
    	}
    	a:hover {
    		color: blue;
    	}
    And the result? The first link (the output I gave is outputted from a loop, iterating through a database table) is dodgy, when I move my mouse over it, only the center/top part acts like a link (as in cursor changes, the address in the status bar.. etc). The other links are fine.

    Problem 2, IE does not display this inline, thus the dvd name, the rating/certificate and my comment on the dvd gets it's own line.

    Any ideas?

    Edit: In IE, all links are fine, so I guess something is wrong with my CSS, if FF is not understanding my style rules?

  2.  

  3. #2
    Senior Member Ferro's Avatar
    Join Date
    Oct 2006
    Location
    UK
    Posts
    386
    Member #
    14204
    Liked
    5 times
    Only a shot in the dark - but try putting "display:block" on the a tags?

  4. #3
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    Nope, same outcome (other than what you would expect from using block).

    I added a <br />before each link and that fixed it.. but I dont want a <br /> so it must be the display property thats the problem..?

  5. #4
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    I don't understand problem No 1 :ermm:

    As for Problem #2, you display: inline; is set to a div with Id particularDvd ... meaning THIS ID will display inline. You need to set it to the other 3 in that DIV instead.

    Have you tried using a DL/DD instead? Wouldn't this be the ideal element for this structure?
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  6. #5
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    Thanks karinne, I will go try your suggested idea for problem number 2.

    Number 1.. look at the "New Posts" link at the top of this page, when you move your mouse over it, only say upper half of the P in Posts would be treated like a link.

    Edit: I set the other 3 divs to inherit, and they are children of particularDvd - thus is that not the same thing?

  7. #6
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    Quote Originally Posted by bfsog
    Number 1.. look at the "New Posts" link at the top of this page, when you move your mouse over it, only say upper half of the P in Posts would be treated like a link.
    Weird ... I copied the code you provided above and i don't have that in FF or IE6 :ermm:

    FF
    Attachment 3557
    IE6
    Attachment 3558


    Quote Originally Posted by bfsog
    Edit: I set the other 3 divs to inherit, and they are children of particularDvd - thus is that not the same thing?
    Hmmm ... ya ... i noticed that after. And weird thing is the display: inline (if you put it in the other 3 divs), it only work for the first 2 :ermm:
    Attached Images Attached Images
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  8. #7
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    Well I got to the bottom of it,
    HTML Code:
    	<div id="particularDvd">
    		<div id="dvdTitle"><b>1.</b> <a href="view.php?id=1" title="View Leon">Leon</a>,</div>
    		<div id="dvdCert">(18)</div>
    		<div id="dvdMySay">"..kick *** film, one of my favourite ever endings.."</div>
    	</div>
    CSS:
    Code:
    	#particularDvd {
    		width: 100%;
    		padding: 10px;
    	}
    	div#dvdTitle {
    		display: inline;
    		font-style: italic;
    	}
    	div#dvdCert {
    		color: red;
    		width: 5%;
    		display: inline;
    	}
    	div#dvdmySay {
    		color: #666666;
    		display: inline;
    		font-weight: bold;
    		font-style: italic;
    		margin-bottom: 5px;
    	}
    Thanks karinne.

  9. #8
    Senior Member karinne's Avatar
    Join Date
    Dec 2003
    Location
    Aylmer QC Canada
    Posts
    1,607
    Member #
    4335
    Liked
    8 times
    Cool! Happy to see you've figured it out! That's was getting weird results :laugh:
    [a web design portfolio - Currently NOT AVAILABLE for work | web design | Re-coding | PSD-to-HTML]
    I'm also on: virb - facebook - twitter - flickr - del.icio.us

  10. #9
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    < wince >. You're going to turn that [minicode]<b>[/minicode] tag into a [minicode]<span class="number">[/minicode]-ish tag, right? :-P

  11. #10
    Senior Member
    Join Date
    May 2003
    Location
    UK
    Posts
    2,354
    Member #
    1326
    Tell you what, shadowfiend, I will just for you

    This is all beta, was just going for results before prettyness.

    Edit: vBulletin added the <b></b> ha


Page 1 of 2 1 2 LastLast

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 02:34 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com