I have a navbar which is dynamic. I want to display the data on same page when user click on link. I am using $_REQUEST. Code is working fine but when I run the script it gives an error that 'undefined index val'... but when user click on a link it works fine. I want to remove that error.
<html>
<head>
<style>
body {
background: #212121;
font-size:22px;
line-height: 32px;
color: #ffffff;
word-wrap:break-word !important;
font-family: 'Quicksand', sans-serif;
margin: 0;
padding: 0;
}
h1 {
font-size: 60px;
text-align: center;
color: #FFF;
margin-top: 150px;
font-family: 'Russo One', sans-serif;
}
h1 span {
color: #FF4649;
}
#container {
margin: 0 auto;
}
nav {
margin: 35px 0;
background-color: #FF4649;
}
nav ul {
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
nav ul li {
display:inline-block;
background-color: #FF4649;
}
nav a {
display:block;
padding:0 10px;
color:#FFF;
font-size:20px;
line-height: 60px;
text-decoration:none;
}
nav a:hover {
background-color: #333;
}
nav ul ul {
display: none;
position: absolute;
top: 60px;
}
nav ul li:hover > ul {
display:inherit;
}
nav ul ul li {
width:230px;
float:none;
display:list-item;
position: relative;
}
nav ul ul ul li {
position: relative;
top:-60px;
left:230px;
}
nav ul ul li {
border: 1px solid white;
}
//li > a:after { content: ' ▼'; }
//li > a:only-child:after { content: ''; }
</style>
</head>
<body>
<html>
<head>
<meta charset="UTF-8">
<title>Pure CSS DropDown Menu</title>
<link href="https://fonts.googleapis.com/css?family=Quicksand|Russo+One&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<?php
$con=mysqli_connect("localhost","root","","links");
if(!$con){
echo "error occured";
}
$query="SELECT * FROM cat";
$result=mysqli_query($con,$query);
?>
<div id="container">
<nav>
<ul>
<?php
while($row=mysqli_fetch_array($result)){
$fn_id=$row['id'];
$sub_query="SELECT * FROM subcat WHERE catid=".$fn_id;
$sub_result=mysqli_query($con,$sub_query);
?>
<li><?php echo $row['name'];?>
<ul>
<?php
while($sub_row=mysqli_fetch_array($sub_result)){
?>
<li> <?php echo $sub_row['anme'];?></li>
<?php
}
?>
</ul>
<?php
}
?>
</li>
</ul>
</nav>
<h1>Simple <span>CSS</span> DropDown Menu</h1>
</div>
<?php
$query='SELECT * FROM data WHERE subcat='.$_REQUEST['val'];
$result=mysqli_query($con,$query);
while($row=mysqli_fetch_array($result)){
?>
<p><?php echo $row['Name'];?></p>
<?php
}
?>
</body>
</html>
</body>
</html>
Change
$query='SELECT * FROM data WHERE subcat='.$_REQUEST['val'];
Into
$query='SELECT * FROM data WHERE subcat='.!empty($_REQUEST['val']) ? $_REQUEST['val'] : '');
I dont know what but my posts are colliding with the navigation bar like this:
http://i.imgur.com/y2qhEzH.png
Thanks if you can help:)
The navigation bar HTML/php
<div>
<nav class="site-nav">
<?php
$args = array(
'theme_location' => 'primary'
)
?>
<?php wp_nav_menu( $args); ?>
</nav> </div>
Post HTML/php
<div>
<?php
if(have_posts()):
while (have_posts()) : the_post(); ?>
<h2><a a href="<?php the_permalink(); ?>">
<?php the_title(); ?></a></h2>
<?php the_content(); ?>
<?php endwhile;
else :
echo '<p>No content found</p>';
endif;
?> </div>
Css
.site-nav ul {
margin: 0;
padding: 0;
}
.site-nav ul li {
list-style: none;
float: left;
}
.site-nav ul li a:link,
.site-nav ul li a:visited {
display: block;
padding: 10px 18px;
border-top: white 3px solid;
text-decoration: none;
}
Im just starting to learn wordpress, and I litterally cant get past this. HELP:)
Try adding this to your CSS:
.site-nav {
float: left;
}
Here's a Fiddle of what your setup might look like minus the PHP, and here's one with the fix.
Full Code
.site-nav ul {
margin: 0;
padding: 0;
}
.site-nav ul li {
list-style: none;
float: left;
}
.site-nav ul li a:link,
.site-nav ul li a:visited {
display: block;
padding: 10px 18px;
border-top: white 3px solid;
text-decoration: none;
}
/* Added this to simulate your window size */
.container {
width: 360px;
}
/* Fix */
.site-nav {
float: left
}
<div class="container">
<div>
<nav class="site-nav">
<ul>
<li>Home</li>
<li>Portfolio</li>
<li>About us</li>
<li>Contact us</li>
<li>Logos</li>
<li>Websites</li>
</ul>
</nav>
</div>
<div>
<h2>Welcome</h2>
<p>Hey!</p>
<p>Welcome to our site.</p>
</div>
</div>
Just adding
float: left
to the parent element did not help.
But adding Clearfix hack helped:)
I have Googled this problem and while there are some hints at fixes, most are theme specific. I did find a link to create a print.css and it works somewhat but the menu navigation still prints over the content in the web page. I only want the content of the page to print...no header, footer, sidebar, or navigation menu. The style page I created via direction of the link is below. I also added the link to the header.php as directed. It seems the print.css works for everything but the navigation menu. There is a custom style sheet named nations-styles.css referred to in the header.php and located at /wp-content/themes/smartbusiness/css. I'm thinking there might be additional navigation problems that need to be address with that style sheet. I am new to CSS, so I'm not sure how to make this work so they navigation doesn't show up in the printing of the page. I've tried #header, .nav-box {display:none} and that doesn't seem to work either.
All help resolving this issue would be greatly appreciated.
print.css below
#media print {
body {background:white;
font-size:10pt;
margin:0 }
#sidebar { display:none }
#header { display:none}
#header, .nav-box {display:none}
#nav {display:none}
#content{ margin-left:0;
float:none;
width:auto }
.demo .red { color:black;
font-weight:bold }
#content a { font-weight:bold;
color:#000066;
text-decoration:underline }
#content{ margin-left:0;
float:none;
width:auto }
#footer, .ad { display:none }
h1, h2, h3, h4, h5, h6 { page-break-after:avoid;
page-break-inside:avoid }
h3 { margin-left:10px;
margin-bottom:0px;
padding-bottom:0px }
blockquote, table, pre { page-break-inside:avoid }
ul, ol, dl { page-break-before:avoid }
img.centered { display: block;
margin-left: auto;
margin-right: auto; }
img.right { padding: 4px;
margin: 0 0 2px 7px;
display: inline; }
img.left { padding: 4px;
margin: 0 7px 2px 0;
display: inline; }
.right { float: right; }
.left { float: left }
img { page-break-inside:avoid;
page-break-after:avoid; }
}
header.php below
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>">
<title><?php
/* Print the <title> tag based on what is being viewed. */
global $page, $paged;
wp_title( '|', true, 'right' );
// Add the blog name.
bloginfo( 'name' );
// Add the blog description for the home/front page.
$site_description = get_bloginfo( 'description', 'display' );
if ( $site_description && ( is_home() || is_front_page() ) ) echo " | $site_description";
// Add a page number if necessary:
if ( $paged >= 2 || $page >= 2 )
echo ' | ' . sprintf( __( 'Page %s', 'smartbusiness' ), max( $paged, $page ) );
?></title>
<?php
global $shortname;
$favicon = get_option($shortname.'_favicon');
if ($favicon) {
?>
<!-- ~~~~~~ FAVICON ~~~~~~ -->
<link rel="shortcut icon" href="<?php echo $favicon; ?>" />
<?php } ?>
<meta name="viewport" content="width=device-width, <?php if (get_option($shortname."_zoom_feature") == 'No') { echo 'initial-scale=1.0'; } else { echo 'user-scalable=yes'; } ?>">
<?php wp_head(); ?>
<?php
$theme_color_skin = strtolower(get_option($shortname."_theme_color_skin"));
?>
<!--[if lt IE 9]><link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/css/<?php echo $theme_color_skin; ?>/css/ie.css" /><![endif]-->
<!--Added to work with minify - removed from functions.php
<link id="stylesheet_custom_style-css" media="screen" type="text/css" href="/wp-content/themes/smartbusiness/functions/custom-css-main.php" rel="stylesheet"> -->
<link id="stylesheet_custom_style-css" media="screen" type="text/css" href="/wp-content/themes/smartbusiness/css/nations-styles.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" media="print" href="<?php bloginfo('stylesheet_directory'); ?>/print.css" />
</head>
<body <?php body_class('custom-background'); ?>>
<!-- wrapper -->
<div id="wrapper">
<div class="w1">
<div class="w2">
<!-- header -->
<header id="header">
<!-- section -->
<div class="section">
<h1 class="logo"><img src="<?php $custom_logo = get_option($shortname.'_logo'); echo $custom_logo; ?>" alt="<?php echo bloginfo('name'); ?>" /></h1>
<div class="contact-box">
<?php if (get_option($shortname."_phone_number")) { ?><strong class="phone"><?php echo get_option($shortname."_phone_number"); ?></strong><?php } ?>
<?php if (get_option($shortname."_social_links") == 'true') { ?>
<!-- social -->
<ul class="social">
<?php if (get_option($shortname."_social_links_twitter")) { ?><li><?php echo get_option($shortname."_social_links_twitter_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_facebook")) { ?><li><?php echo get_option($shortname."_social_links_facebook_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_pinterest")) { ?><li><?php echo get_option($shortname."_social_links_pinterest_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_dribbble")) { ?><li><?php echo get_option($shortname."_social_links_dribbble_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_vimeo")) { ?><li><?php echo get_option($shortname."_social_links_vimeo_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_googleplus")) { ?><li><?php echo get_option($shortname."_social_links_googleplus_caption"); ?></li><?php } ?>
<?php if (get_option($shortname."_social_links_rss")) { ?><li><?php echo get_option($shortname."_social_links_rss_caption"); ?></li><?php } ?>
</ul>
<?php } ?>
</div>
</div>
<!-- nav-box -->
<nav class="nav-box">
<!-- nav -->
<?php
wp_nav_menu(array(
'menu' => 'Header Menu',
'container' => '',
'container_class' => '',
'container_id' => '',
'menu_class' => '',
'menu_id' => 'nav',
'echo' => true,
'fallback_cb' => 'fallback_default_menu',
'before' => '',
'after' => '',
'link_before' => '',
'link_after' => '',
'depth' => 0,
'walker' => '',
'theme_location' => 'header_menu'
));
//the main menu for iPhone version
dropdown_menu( array('dropdown_title' => 'Header Menu', 'indent_string' => ' - ', 'indent_after' => '','container' => '', 'container_class' => '', 'menu_id' => 'mobile-meny', 'theme_location'=>'header_menu') );
?>
</nav>
</header>
nations-styles.css
#charset "utf-8";
/* Nations Styles */
#main .container h1 { margin-bottom:10px;}
#main .container h2 { margin-bottom:10px;}
#main .container h3 { margin-bottom:10px;}
#main .container h4 { margin-bottom:5px;}
#main .container h5 { margin-bottom:5px;}
#main .container h6 { margin-bottom:5px;}
#main .container p { margin-bottom:15px;}
.space { display: block; width:100%; height:15px;}
strong, b { font-weight: bold;}
ul.ulFloatL { overflow: auto;}
ul.ulFloatL li { float: left; width:49.5%; margin-bottom:15px; font-weight:bold; font-size:18px;}
ul.ulFloatL li img { max-width:100%; margin:0;}
.overflowH { overflow:hidden;}
.floatL { float:left;}
.iconLogo { margin: 3px 20px 3px 0;}
.grid-cols .col33 { overflow: auto;}
.imgScale { max-width:100%; width:auto;}
#sidebar .widget ~ .widget { margin-top:20px;}
h2 .divider { margin:0 0 10px; padding:0;}
h2 .divider ~ .divider { padding:13px 0 0; margin-bottom: 25px;}
.btn.red, .tp-caption.slide_button a, .comment-form .submit, .tp-caption.slide_button a.btn { background:#C7362D; border: 1px solid #b7261D !important; color:#FFE6E7; border-radius:5px !important; padding:8px 15px 7px; text-transform: uppercase; font:300 14px/16px 'Oswald',Arial,Helvetica,sans-serif;}
.btn.red:hover, .tp-caption.slide_button a:hover, .comment-form .submit:hover, .tp-caption.slide_button a.btn:hover { background:#b7261D; color:#fff;}
.tp-caption.slide_title { color:#C7362D;}
.comment-form .submit input { opacity:0;}
.fullwidthbanner-container .linklist a { font-size:24px; color:#C7362D; display: block;}
.fullwidthbanner-container .linklist a:hover, .fullwidthbanner-container .linklist a:active, .fullwidthbanner-container .linklist a:focus { color:#333;}
.nav-box #nav .sub-menu { top: 25px;}
.nav-box > ul > li > .has-drop-down-a { background-position: 100% 12px;}
.tp-leftarrow.default, .tp-rightarrow.default { top:50% !important;}
.nocomments { display:none;}
#header { background: #fff url(/wp-content/uploads/2013/10/bodyBg-grey.jpg) top center no-repeat;}
#header .section { padding:10px; border: none;}
.nav-box { padding-top:10px;}
.nav-box > ul > li { padding-bottom:11px;}
.social .twitter {background: transparent url("/wp-content/themes/smartbusiness/css/red/images/twitter-hover.png") no-repeat scroll 0 0; opacity:0.7;}
.social .facebook {background: transparent url("/wp-content/themes/smartbusiness/css/red/images/facebook-hover.png") no-repeat scroll 0 0; opacity:0.7;}
.social .rss {background: transparent url("/wp-content/themes/smartbusiness/css/red/images/rss-hover.png") no-repeat scroll 0 0; opacity:0.7;}
.social .facebook:hover, .social .twitter:hover, .social .rss:hover { opacity:1;}
.fullwidthbanner-container { background-color:#eee;}
#sidebar .current-menu-item a { color:#999;}
div.rss-output { padding:0 0 15px;}
footer .blog-links p, footer .news-contents p { line-height:16px;}
footer .news-contents div ~ div p { margin-top:10px;}
footer .news-contents .news { margin-left:0 !important;}
/* Footer Fix */
#footer, .footer-holder, .footer-frame, footer, footer .add-block { display: block !important; width:100%;}
footer .case { margin:0 auto;}
/* Home Slider */
.fullwidthbanner-container { margin-left:-2000px; float:left;}
.fullwidthbanner-container.loaded {margin-left:0; float:none;}
.fullwidthbanner-container.loaded .fullwidthbanner { max-height:300px;}
/* Theme Styles */
/* logo */
.logo { float:left; background: none; width:136px; height:80px; overflow: visible; text-indent: 0;}
html {background:#fff;}
.nav-box > ul, .nav-box > ul ul { font:18px/19px "Oswald", Arial, Helvetica, sans-serif !important; }
.nav-box > ul ul a { font-size: 14px !important; }
.nav-box > ul a { color: #FFE6E7 !important; }
.nav-box > ul a:hover { color: #ffffff !important; }
.nav-box > ul ul a { color: #333333 !important; }
.nav-box > ul ul a:hover { color: #ffffff !important; }
.nav-box {background:#C7362D; border-bottom: 1px solid #dddddd;}
h1, h2, h3, h4, h5, h6 {font-family:Oswald, Arial, Helvetica, sans-serif !important;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {font-family:Oswald, Arial, Helvetica, sans-serif !important;}
h1, h2, h3, h4, h5, h6 {color:#111111 !important;}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {color:#111111 !important;}
#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6 {color:#b8b8b8 !important;}
#footer h1 a, #footer h2 a, #footer h3 a, #footer h4 a, #footer h5 a, #footer h6 a {color:#b8b8b8 !important;}
#footer h1, #footer h2, #footer h3, #footer h4, #footer h5, #footer h6 {color:#ffffff !important;}
#footer h1 a, #footer h2 a, #footer h3 a, #footer h4 a, #footer h5 a, #footer h6 a {color:#ffffff !important;}
body {font-family:Arial, Arial, Helvetica, sans-serif;}
body {font-size:12px;}
body {color:#222222;}
a {color:#C7362D;}
a:hover{color:#001F5B;}
There is a div near the bottom of your page that starts like this:
<div class="select-options options-hidden drop-menu drop-dropdown-menu " style="position: absolute; top: 0px; left: 0px; width: 0px;"></div>
Most likely this is coming in from a menu plugin or your theme.
So in your print stylesheet, add:
.drop-holder{display: none !important; visibility:hidden !important;}
The "!important" will help force the style to take effect.
In the future, a great way to test print styles is using Google Chrome's Developer's Tools.
When viewing page in Chrome, press F12. In the Emulation tab at the bottom, Click Media, check the box next to CSS media, and make sure the dropdown is set to print. Then you can view your page using your print stylesheet.
I was wondering how I can achieve an effect similar to this website. When you scroll down the site the logo disappears but the menu remains fixed:
http://www.nowness.com/
This is my site: http://www.itsalifestylething.co.uk/quick-cupcake-catch-up/
PHP
<body <?php body_class(); ?>>
<div id="page" class="hfeed site">
<header id="masthead" class="site-header" role="banner">
<hgroup>
<h1 class="site-title"><img src="http://www.itsalifestylething.co.uk/wp-content/uploads/2013/11/logo-large.png" /></h1>
<h2 class="site-description"><?php bloginfo( 'description' ); ?></h2>
</hgroup>
<nav id="site-navigation" class="main-navigation" role="navigation">
<h3 class="menu-toggle"><?php _e( 'Menu', 'twentytwelve' ); ?></h3>
<a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to content', 'twentytwelve' ); ?>"><?php _e( 'Skip to content', 'twentytwelve' ); ?></a>
<?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu' ) ); ?>
</nav><!-- #site-navigation -->
<?php if ( get_header_image() ) : ?>
<img src="<?php header_image(); ?>" class="header-image" width="<?php echo get_custom_header()->width; ?>" height="<?php echo get_custom_header()->height; ?>" alt="" />
<?php endif; ?>
</header><!-- #masthead -->
<div id="main" class="wrapper">
CSS
/* Header
------------------------------------------------------------ */
.site-header {
padding: 5px 0 !important;
}
hgroup {
width: 100%;
}
#masthead {
width: 960px;
margin: 0 auto;
position: relative;
}
h1.site-title {
margin: 0 auto;
width: 480px;
height: 123px;
}
.social img {
margin-right: 15px;
}
/* Nav
------------------------------------------------------------ */
.main-navigation {
width: 100%;
margin: 0px !important;
}
.main-navigation div.nav-menu > ul {
border: 0px !important;
margin: 0 auto;
width: 430px;
}
.main-navigation li {
margin: 0 25px 0 0;
}
.main-navigation li ul {
padding-top: 2px;
z-index: 10;
}
.main-navigation li a:hover, .main-navigation .current_page_item > a {
color: #33d898;
font-weight: normal;
}
.main-navigation li ul {
-webkit-box-shadow: 0px 5px 10px 1px rgba(0,0,0,0.2);
box-shadow: 0px 5px 10px 1px rgba(0,0,0,0.2);
width: 200px;
}
.main-navigation li ul li a {
background: #ffffff;
border-bottom: 1px solid #e7e7e7
}
.main-navigation li ul li a:hover {
background: #ffffff;
color: #33d898;
}
.nav-menu {
border-bottom: 1px solid #e7e7e7;
}
This is how I would go about it with html, css, and jQuery.
First this is how I would order my html,
<nav>
<span class="logo">Your Logo</span>
<ul>
<li id="logo">Your Logo</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>
</nav>
Next the css,
html, body {
margin: 0;
padding: 0;
}
ul {
margin: 0;
padding: 0;
list-style-type: none;
}
nav {
width: 80%;
background: #c1c1c1;
position: fixed;
top: 0;
left: 50%;
margin-left: -40%;
}
nav li {
display: inline-block;
cursor: pointer;
}
#logo {
display: none;
}
#logo.scroll {
display: inline-block;
}
.logo {
font-size: 50px;
font-family: "century gothic";
}
and finally the little bit of jQuery,
$(window).scroll(function() {
$('.logo').hide();
$('#logo').addClass('scroll');
if ($(window).scrollTop() === 0) {
$('.logo').show();
$('#logo').removeClass('scroll');
}
});
Here is a jsfiddle, Link.
You have to use javascript to add a position: fixed to your header. Also you need to give your body an offset.
nav-menu-static {
position: fixed;
top: 0;
background: #fff;
width:960px
}
#masthead {
background: none repeat scroll 0 0 #FFFFFF;
margin: 0 auto;
position: fixed;
width: 960px;
}
Then set the margin-top for the .site-content class
I am trying to get three images to connect for my content box but for some reason there is some space between the second and the third. Any help would be appreciated.
here is the site: http://hyvhuynh.com/hyperbolical-blog
<?php get_header(); ?>
<div id="content">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div <?php post_class();?> id="post-<?php the_ID();?>">
<div id="mythreedivs">
<div id="top">
</div>
<div id="mid">
<h2 class="post-title"><?php the_title(); ?></h2>
<ul class="meta">
<li><?php the_time('F j, Y'); ?></li>
</ul>
<div class="postcontent">
<?php the_content(the_title('', '', false)." - continue reading"); ?>
</div>
<ul class="meta postfoot">
<?php if('open' == $post->comment_status) : ?><li class="comment_link"><?php comments_popup_link('Comment on '.$post->post_title, '1 Comment on '.$post->post_title, '% Comments on '.$post->post_title,'postcomment','Comments are off for '.$post->post_title); ?></li><?php endif;?>
<?php if(get_the_tag_list()) :?>
<li>Tags: <?php the_tags('<ul><li>',',</li> <li>','</li></ul>');?></li>
<?php endif;?>
</ul>
</div>
<?php endwhile; ?>
<ul class="prevnext">
<li><?php next_posts_link('« Older Posts'); ?></li>
<li><?php previous_posts_link('Newer Posts »');?></li>
</ul>
<div id="bottom">
</div>
<?php endif; ?>
</div>
</div>
<?php get_footer(); ?>
---------css---------------
#mid {
background-image:url('http://hyvhuynh.com/wp-content/themes/zenlite/images/bodymiddle.png');
width:806px;
}
#bottom {
background-image:url('http://hyvhuynh.com/wp-content/themes/zenlite/images/bodybottom.png');
width:806px;
height:27px;
}
#header {
width:800px;
float:right;
margin:0 0 50px 0;
}
/*
Navigation Bar Time!
*/
#jsddm
{ margin: 20px 0 0 0;
padding: 0;
font-weight:bold;
text-shadow: #000000;
}
#jsddm li
{ float: left;
list-style: none;
font: bold 12px Tahoma, Arial}
#jsddm li a
{ display: block;
background: #E7E7EF;
padding: 5px 12px;
text-decoration: none;
border: 1px solid #555555;
width: 70px;
color:#000000;
white-space: nowrap}
#jsddm li a:hover
{ background: #1A4473}
#jsddm li ul
{ margin: 0;
padding: 0;
position: absolute;
visibility: hidden;
}
#jsddm li ul li
{ float: none;
display: inline}
#jsddm li ul li a
{ width: auto;
background: #E7E7EF}
#jsddm li ul li a:hover
{ background: #1A4473}
/*
End Navigation Time!
*/
.logo {
float:right;
}
#content .post {
float:left;
width:800px;
}
#content .page,#content .attachment,.postcontent {
width:800px;
text-decoration:none;
}
.photo {
width: 250px;
height:700px;
background-color:#000000;
margin:0 0 0 880px;
}
.slideshow { height: 232px; width: 232px; margin:0 0 0 880px; }
.slideshow img { border: 5px solid #000; }
.post-title {
margin:0;
padding:0;
text-align:center;
}
.post-title a {
text-decoration:none;
color:#000000;
}
.post-title a:hover,.post-title a:active,.post-title a:focus {
text-decoration:underline;
color:#5F625F;
}
#content .meta li,#content .prevnext li,#content .gallery li {
list-style-image:none;
list-style:none;
}
.meta {
margin:5px 0 0;
padding:0;
font-size:.85em;
}
.meta ul,.meta li {
margin:0;
padding:0;
}
.meta ul {
display:inline;
}
.meta li li {
display:inline;
padding-right:.3em;
}
.postfoot {
clear:both;
padding-bottom:10px;
line-height:1.2em;
}
.author .posts-by {
padding-top:10px;
}
.clearfix {
display: inline-block; }
.clearfix:after {
content: " ";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#footer {
clear:both;
margin:0 auto;
padding:0 0 5px;
text-align:center;
font-size:.8em;
border: 0;
width:800px;
height:200px;
}
#footer ul {
clear:both;
margin:0;
padding:0;
}
#footer li {
display:inline;
margin:0;
padding:0 5px;
}
#footer li.rss {
position:relative;
top:3px;
}
.copyright {
}
.copyright a
{
}
.copyright a:hover
{
}
.postcontent p {
text-decoration:none;
border:0;
border-style:none;
}
.postcontent p a:hover {
color:#fff;
}
The space is from the margin on your unordered list. Add this to your stylesheet
ul.prevnext {margin: 0px;}
And it'll correct it. I'm not sure what you're doing with it though, so you may want to just scrap it for now because once you add any items, it will pop up again. Or move it to a different position as mltsteeves mentioned.
<ul class="prevnext"> is causing the space between the two divs, try putting it inside the previous div.
You have nesting errors in your markup. I would sort them out first, from what I can see in Firebug, it might already sort it out.
end tag for "div" omitted, but OMITTAG NO was specified
end tag for "ul" which is not finished
The block below:
<ul class="prevnext">
<li></li>
<li></li>
</ul>
is not contained inside the proper <div> tag, it is between your mid and bottom divs.