Responsive Theme Nav menu help

User 2327277 Photo


Registered User
6 posts

I bought a couple responsive themes and have been working at adding my content to them but am finding I am having some difficulty because I did not receive the codeing for all of the CSS files in the themes. So when I add something it is predetermined that it will be a certain size, location etc. I have added new images and resized them accordingly to the image folder. While that has solved the size issue it has not solved the location issue.

Case in point, I have the Autumn theme and I have added a couple new navigation tabs to the menu and they are not lining up the way I want them too. They are added under the current ones but sit sort of on top of the original ones. They are not neatly stacked underneath the original tabs and I am unable to make them do this. I tried adding <br> to the code in the <ul> area and that did break the tabs but again it either sits on top of the tabs or has too much space between them. This is a double row menu.

What can I do to manipulate this theme?

Also, I added my own image rather than the lame ones that come with the theme and when I try to add text to the right of the image it either places the text with no space so the text butts up against the image or places it all the way to the right with huge amounts of space between the image and the text. I even tried adding a table with 2 columns to no avail.

So if the theme isn't going to allow me to make adjustments to how it looks, it is not going to work for me.

Any help would be appreciated?

Thanks
User 2073552 Photo


Registered User
1,625 posts

Hello!

Can you provide a link to the site in questions so that we make look for ourselves? :)

Thanks!
"An Apple doth not fall far from its tree, yet an orange does."

https://lbwebsitedesign.com - Responsive Web Design & Web Hosting Services.
http://helpsite.sirage.com - HTML5, CSS3 and CC Help Video Blog.
User 2327277 Photo


Registered User
6 posts

Well the site is not published. Do you mean you would like to see the code?

Here it is:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="Description" content="Autumn Theme">
<meta name="viewport" content="width=device-width" />
<meta name="author" content="CoffeeCup Software, Inc.">
<meta name="Copyright" content="Copyright (c) 2010 CoffeeCup, all rights reserved.">
<title>Tackle Box Of Savings -Home</title>
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


<link rel="stylesheet" href="stylesheets/default.css" />
</head>
<body>
<section id="mainRight" class="clear">
<header>
<b><big><h1><span><font color="red">Value in Every Tackle Box</span></font color></h1></b></big>
</header>
<nav>
<ul>
<li><a href="index.html" class="selected">Home</a></li><li><a href="about.html">About</a></li><li><a href="signupformailer.html">Sign Up</a></li><li><a href="featuredproducts.html">Featured Products</a></li><li><a href="pastcoupons.html">Past Coupons</a></li><li><a href="productreviews.html">Product Reviews</a></li><br><br><li><a href="madeintheusa.html">Made in the USA</a></li><li><a href="currentdeals.html">Current Deals</a></li>
</ul>
</nav>

<br><br>


<h1>Featured Product</h1>
<table border="0" cellpadding="10" width="100%">
<tr><!-- Row 1 -->
<td><img src="images/featuredproduct-wake-jig-wobbler.32462520_std.jpg" width="320" height="547" alt="" title="" border="0"></td><!-- Col 1 -->
<td><div class="colRight"><font color="white">This innovative hybrid lure has a unique swimming action, which results from the combination of a jig head and a freely moving wobbler body.<br><br>

The lead head allows for easy casting and gives access to depths, where conventional wobblers are not able to reach.<br><br>

The Jigwobbler shows its vibrant swimming action also while sinking. Because predators often strike during stops, the Jigwobbler triggers strikes very effectively. Depending on the retrieving speed and style, the Jigwobbler can be used at any desirable depth.<br><br>

The Jigwobbler can be fished with a steady retrieve or a jerk pause technique.<br>

Available in five sizes:

<ul>
<li>5 cm and 8 g (2" and 0.3 oz.)</li>
<li>6,5 cm and 18 g (2,5" and 0.6 oz.)</li>
<li>8 cm and 29 g (3" and 1 oz.)</li>
<li>15 cm and 65 g (6" and 2.3 oz.)</li>
<li>15 cm and 93 g (6" and 3.3 oz.)</li>
</ul>

For more information on this exciting new lure, check out their site at: www.jigwobbler.com

Advertisers please click here for more info</font></td><!-- Col 2 -->
</tr>
</table>

</section>
<div class="colLeft">
<h4>Who we are</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exertion ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exertion ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<a class="more" href="services.html">Read More</a>
</div>
<div class="colRight">
<h4>A bit of history</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exertion ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltate velit esse cillum dolore eu fugiat nulla pariatur anim id est laborum.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exertion ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<a class="more" href="services.html">Read More</a>
</div>
</section>

<!-- end columns -->
<h5 id="signature">Autumn Website | CoffeeCup Software</h5>
<footer>
<p>&copy; 2011 Autumn, Inc. All rights reserved.</p>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</footer>
</section>
<!-- end mainRight -->
<div id="logoTxt">
<h1><span></span></h1>
<h2><span></span></h2>
</div>
</body>
</html>

I have not added all of the features for the site yet or even changed all of the stock text. I am kinda stuck on the Nav portion at this point.

Thanks for the help
User 187934 Photo


Senior Advisor
20,247 posts
Online Now

All the adjustments would be made in the stylesheets/default.css file.
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 1964159 Photo


Registered User
156 posts

Hello Jacqueline, I would echo what Eric writes - I would, he's younger than me AND a senior advisor. But yes, layout and style is all controlled with CSS. Ready-made themes are a mystery to me and I don't know how they mix and match with hand-coded content. I am getting into "responsive design" and target 3 screen resolutions. This means a total of four CSS pages - GLOBAL - LARGE - MEDIUM and SMALL. I guess someone better than I will need to see your current CSS pages as well as the HTML.
User 2327277 Photo


Registered User
6 posts

Thanks for the responses.

I have been working on my own design now so I think I will go with that. I am learning CSS and probably need some pointers here and there so If I do make a post, I hope that you all would be so kind as to lend a hand?

Someday I will have to try the other page idea for CSS. For now, it is contained on the main page. Again, I am a newbie at CSS. 4 Pages seems way over my head for doing my own responsive theme. In fact, I didn't even know that could be done, so I learned something already.

Thanks.

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.