WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Logo alignment (13 posts)

  1. lenny86
    Member
    Posted 1 year ago #

    Hi!

    I have a website where at the top of the page I use menu. I have placed inside that div logo as a CSS background image
    [background: #C7C7C7 url('images/nav.png') center left no-repeat scroll;
    [background: transparent url('images/nav.png') center left no-repeat scroll;]

    But it was causing problems and I could't make it as a hyperlink I have uploaded static page at: http://kwatery.herobo.com/PPOZ/home.html where I have split div which holds menu so it could hold image as well.

    Now I have problem with aligning it properly. Here is how my DIV looks like with that static page:

    <div id="ppoz-main">
    <div align="left">
    <div style="float:left"><img src="nav.png" width="270" align="" height="75" alt="logo" longdesc="home.html"></div>

    I assume I have to align it with CSS but I can't figure out how to do that.

    One more thing: will that solution work with WordPress header file?

    Thanks!

  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Sorry, WordPress.org forums only support WordPress.org themes, plugins and the core application.

  3. lenny86
    Member
    Posted 1 year ago #

    I'm sorry I didn't make myself clear.

    I do have a wordpress site at following address: http://ppoz.net78.net/WP/
    But I made it static so I wouldn't get the straight answer on how to edit WP files and I would have to think about it a little.

    As you can see at the WordPress site there is a logo as CSS background. I understand that I have to edit the header file in the similar way I have done with static page but how should I edit CSS to align it as it is right now on WP page?

  4. Andrew
    Forum Moderator
    Posted 1 year ago #

    As your query is not related to WordPress, you can ask it in CSS forums such as http://csscreator.com/forum

  5. LastForOne
    Member
    Posted 1 year ago #

    first of all i'd recommend you to use classes/ids instead of inline styling, for example you can define a class .left{ float: left; } and float any element to the left by applying that class EG: <div class='left'>go left</div> that will save you a lot of time going back and forth aligning the elements and you can use margin:0 auto; which is equal to (top & bottom 0; left and right auto;)

    Goodluck,
    LastForOne

  6. lenny86
    Member
    Posted 1 year ago #

    Thanks LastForOne!!

    I'll try it tonight and let you know if I handled it!

  7. lenny86
    Member
    Posted 1 year ago #

    Hi,

    I have done it and it looks exactly as I wanted to but now anything I will place inside that div is not clickable. I have placed there a image and a word as a hyperlink and I was not able to click on any of them.

    Here is the CSS and HTML
    .ppoz-left
    {
    float: left;
    margin:auto auto 20px 250px;
    padding:0 10px 0 100px;
    }

    <div class='ppoz-left'><a href="home.html"><img src="images/nav.png" width="300" height="83">link</a></div>
    [Please post markup between backticks or use the code button. Your posted code may now have been permanently damaged by the forum's parser.]

    any idea what am I doing wrong?

  8. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

  9. LastForOne
    Member
    Posted 1 year ago #

    this is what you've
    <img src="images/nav.png" width="300" height="83">
    Replace it with
    <img src="images/nav.png" width="300" height="83" />

    you forgot the trailing slash to close the <img> tag.
    hope that works.

  10. lenny86
    Member
    Posted 1 year ago #

    Hi,

    I have found a way to resolve this with a static page:

    [Way too much code deleted - please use code buttons per the forum guidelines]

    any idea on how to include clickable logo within that div?

  11. lenny86
    Member
    Posted 1 year ago #

    Hi,

    I have placed my div like that:

    <nav class="ppoz-nav clearfix">
    <strong><a><img src="../images/nav.png" width="300" height="83" alt="logo" align="left" /></a></strong>
    <?php
    	echo theme_get_menu(array(
    			'source' => theme_get_option('theme_menu_source'),
    			'depth' => theme_get_option('theme_menu_depth'),
    			'menu' => 'primary-menu',
    			'class' => 'ppoz-hmenu'

    And I can see the container that should hold the image but the image itself won't show up on the page. I have tried different paths to the image and still nothing.

    Any advise?

  12. WPyogi
    Volunteer Moderator
    Posted 1 year ago #

    Your site URL does not seem to be valid anymore?? Try using an absolute file path.

    Beyond that, try asking on Artisteer's forums -- as their themes are not supported here.


    [Also, please see: http://codex.wordpress.org/Forum_Welcome#Posting_Code ]

  13. lenny86
    Member
    Posted 1 year ago #

    Absolute file path work like a charm!

    Thanks!!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.