Page 4 of 4 FirstFirst ... 234
Results 31 to 40 of 40

Thread: php with css..

  1. #31
    Join Date
    May 2006
    Posts
    46
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    ya i want to stick to phpcause he will keep the images

  2. #32
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Alright, well I don't know much php but you want to get this:
    HTML Code:
    <a href="http://softcoredesign.com/admin/art/pepe_bus.jpg" target="_blank"><img src="http://softcoredesign.com/admin/art/pepe_bus.jpg" alt=""  /></a>
    So maybe this will do:
    PHP Code:
    <?php echo '<a href="/members/Gymgraph/'.$row['type1'].'/'.$row['pic1'] .'" target="_blank"><img src="/members/Gymgraph/'.$row['type1'].'/'.$row['pic1'].'" alt="" /></a>'?>
    Put that in the content div in the page I sent you instead of the images coded with html.
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  3. #33
    Join Date
    May 2006
    Posts
    46
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    ok here it is modified

    http://softcoredesign.com/main4.php

    PHP Code:
    <?php
    // database connect script. 

    mysql_connect("localhost""techker_techker""techker") or die(mysql_error()) ;
    mysql_select_db("techker_softcore") or die(mysql_error()) ;

    $fileSQL=" SELECT *
    FROM featured WHERE location=1
    "
    ;
    $fileLIST=mysql_query($fileSQL);

    $fileSQL2=" SELECT *
    FROM featured WHERE location=2
    "
    ;
    $fileLIST2=mysql_query($fileSQL2);

    $fileSQL3=" SELECT *
    FROM featured WHERE location=3
    "
    ;
    $fileLIST3=mysql_query($fileSQL3);

    $fileSQL4=" SELECT *
    FROM featured WHERE location=4"
    ;
    $fileLIST4=mysql_query($fileSQL4);

    $fileSQL5=" SELECT *
    FROM featured WHERE location=5
    "
    ;
    $fileLIST5=mysql_query($fileSQL5);

    $fileSQL6=" SELECT *
    FROM featured WHERE location=6
    "
    ;
    $fileLIST6=mysql_query($fileSQL6);

    $fileSQL7=" SELECT *
    FROM featured WHERE location=7
    "
    ;
    $fileLIST7=mysql_query($fileSQL7);

    $fileSQL8=" SELECT *
    FROM featured WHERE location=8
    "
    ;
    $fileLIST8=mysql_query($fileSQL8);

    $fileSQL9=" SELECT *
    FROM featured WHERE location=9
    "
    ;
    $fileLIST9=mysql_query($fileSQL9);

    ?>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    * {
        padding:0;
        margin:0;
    }
    body {
        background-color:#CCCCCC;
    }
    #wrapper {
        background-image:url(main.jpg);
        background-repeat:no-repeat;
        height:881px;
        width:886px;
        position:relative;
        margin:auto;
        border-left:7px solid black;
        border-right:7px solid black;
        border-top:10px solid black;
        border-bottom:9px solid black;
    }
    #content {
        width:472px;
        position:absolute;
        right:11px;
        bottom:51px;
        height: 521px;
    }
    #content img {
        width:115px;
        border:none;
        margin:2px;
    }
    </style>
    </head>
    <body>
    <div id="wrapper">
      <div id="content"><? while ($row = @mysql_fetch_assoc($fileLIST)) { ?>
      <?php echo '<a href="/admin/art/'.$row['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row2 = @mysql_fetch_assoc($fileLIST2)) { ?>
      <?php echo '<a href="/admin/art/'.$row2['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row2['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row3 = @mysql_fetch_assoc($fileLIST3)) { ?>
      <?php echo '<a href="/admin/art/'.$row3['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row3['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row4 = @mysql_fetch_assoc($fileLIST4)) { ?>
      <?php echo '<a href="/admin/art/'.$row4['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row4['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row5 = @mysql_fetch_assoc($fileLIST5)) { ?>
      <?php echo '<a href="/admin/art/'.$row5['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row5['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row6 = @mysql_fetch_assoc($fileLIST6)) { ?>
      <?php echo '<a href="/admin/art/'.$row6['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row6['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row7 = @mysql_fetch_assoc($fileLIST7)) { ?>
      <?php echo '<a href="/admin/art/'.$row7['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row7['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?><? while ($row8 = @mysql_fetch_assoc($fileLIST8)) { ?>
      <?php echo '<a href="/admin/art/'.$row8['pic'] .'" target="_blank" >
    <img src="/admin/art/'
    .$row8['pic'].'" border="0" alt="" width=65/>
    </a>
    <br />'
    ?></div>
    </div><? }}}}}}}} ?>
    </body>
    </html>

  4. #34
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Change the php to this:
    PHP Code:
    <? while ($row = @mysql_fetch_assoc($fileLIST)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row['pic'] .'" target="_blank" ><img src="/admin/art/'.$row['pic'].'" alt="" /></a>'?>
    <? 
    while ($row2 = @mysql_fetch_assoc($fileLIST2)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row2['pic'] .'" target="_blank" ><img src="/admin/art/'.$row2['pic'].'" alt="" ></a>'?>
    <? 
    while ($row3 = @mysql_fetch_assoc($fileLIST3)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row3['pic'] .'" target="_blank" ><img src="/admin/art/'.$row3['pic'].'" alt="" ></a>'?>
    <? 
    while ($row4 = @mysql_fetch_assoc($fileLIST4)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row4['pic'] .'" target="_blank" ><img src="/admin/art/'.$row4['pic'].'" alt="" ></a>'?>
    <? 
    while ($row5 = @mysql_fetch_assoc($fileLIST5)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row5['pic'] .'" target="_blank" ><img src="/admin/art/'.$row5['pic'].'" alt="" ></a>'?>
    <? 
    while ($row6 = @mysql_fetch_assoc($fileLIST6)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row6['pic'] .'" target="_blank" ><img src="/admin/art/'.$row6['pic'].'" alt="" ></a>'?>
    <? 
    while ($row7 = @mysql_fetch_assoc($fileLIST7)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row7['pic'] .'" target="_blank" ><img src="/admin/art/'.$row7['pic'].'" alt="" ></a>'?>
    <? 
    while ($row8 = @mysql_fetch_assoc($fileLIST8)) { ?>
    <?php 
    echo '<a href="/admin/art/'.$row8['pic'] .'" target="_blank" ><img src="/admin/art/'.$row8['pic'].'" alt="" ></a>'?>
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  5. #35
    Join Date
    May 2006
    Posts
    46
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    wow lol that was a bbbip..

    its good but when i reseize the images to fit the div

    it look like this

    http://softcoredesign.com/main4.php

  6. #36
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Change this:
    Code:
    #content {
    	width:276px;
    	position:absolute;
    	right:11px;
    	bottom:51px;
    	height: 521px;
    }
    To find out what width to have on the content you need to multiply the number of images you want on one row with the width of the image and its margins. So now you would have 69px (65px plus 2px margin on both left and right side) times 4 (number of images you said before you want on one row) which gives you 276px.
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  7. #37
    Join Date
    May 2006
    Posts
    46
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Nice job!!

    now the hard part can you explain what we did?so i will now for next script?lol

  8. #38
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    Well, to simplify, this is the code you have in the body:
    HTML Code:
    <div id="wrapper">
      <div id="content">Images in here</div>
    </div>
    This is what the css does:

    Code:
    * {
    	padding:0;
    	margin:0;
    }
    Targets all elements (* means everything) and removes any margins or padding that the browsers have by default.

    Code:
    body {
    	background-color:#CCCCCC;
    }
    Gives the body the Grey background color.

    Code:
    #wrapper {
    	background-image:url(main.jpg);
    	background-repeat:no-repeat;
    	height:881px;
    	width:886px;
    	position:relative;
    	margin:auto;
    	border-left:7px solid black;
    	border-right:7px solid black;
    	border-top:10px solid black;
    	border-bottom:9px solid black;
    }
    The wrapper div is the container that has the black frame and the big image with the brushes and the pencil.

    background-image:url(main.jpg); gives it the background image main.jpg (which I suggest you make yourself because the quality is low since I uploaded it to the forum).

    background-repeat:no-repeat; prevents the background from repeating. This line is not really necessary if the background image is the same size as the wrapper div.

    height:881px; and width:886px; make the wrapper div the large enough so the entire background image will show (the image I attached was actually 886x881 pixel, but like I said, It was chopped off a bit). When you make your own background image, make sure to change these line to have the same height and width as your image.

    position:relative; and margin:auto; are used to center the wrapper div on the page.

    And the borders speak for themselves I guess. I made them the same width as you had in your original page.

    Code:
    #content {
    	width:400px;
    	position:absolute;
    	right:57px;
    	bottom:57px;
    	height: 346px;
    }
    The content div is the container that has all the images.

    The width I explained before (it should actually be 356px if you follow my "formula" in my other post).

    position:absolute; is used to position the content div in the wrapper div.

    right:57px; and bottom:57px; specify the space between the right and bottom sides and the outer div (wrapper). You can use these, as you probably found out, to move the content div.

    height: 346px; specifies the height of the content div. You added this yourself so I guess you know how it works. If you don't have it the height of the div would automatically adjust to the images inside.

    Code:
    #content img {
    	width:85px;
    	border:none;
    	margin:2px;
    }
    This targets all the images (the thumbnails) inside the content div container. As I'm sure you've understood, you can change the width of the thumbnail here and the margin around them. Without the 2px margin, they will be stuck to each other. The border:none; removes the border that is set by default by some browsers to images with links.

    I hope this is clear enough. If you have any more questions, don't hesitate to ask. Good luck!
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  9. The Following User Says Thank You to Snookerman For This Useful Post:

    techker (12-14-2008)

  10. #39
    Join Date
    May 2006
    Posts
    46
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    hey a huge thx!!

  11. #40
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    You're welcome! If you feel the problem has been solved you can go to your first post in this thread, edit, go advanced and add the Resolved prefix to the title of the thread. Good luck!
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

Tags for this Thread

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
  •