I sort of feel like a moron for asking this but I've been stumped on this question for about 2 days. On a website I'm trying to put together, http://gravenimage.us/awf/ , the sidebar, which I want to be on the right in the main content area, is showing up at that bottom. I've tried adjusting the max-width, css align, css display, and a bunch of other things. I've gotten the sidebar to move around a little bit but that's it. I'm pretty sure the issue is that the main content is fixed to a certain width, and it's supposed to be flexible for when the sidebar is called, but that's just not happening. Any ideas? I'd really appreciate some assistance.
http://www.gravenimage.us/awf/screenshot.png
Check your page / post copy... make sure to view HTML mode and not the visual mode,
check for any rouge opening or closing div tags that may be there,
when you copy paste content into the visual editor, most of the time any html content will be pasted in there also..
or check the theme /page.php file, looks like the sidebar is being pulled in the content div, messing up the rest of the layout!
check for any instance of...
<?php the_content();?>
<?php get_sidebar();?>
good luck..
Related
I'm asking for help for those who have experience in changing an html file to a php file. I've tried everything I know (and I'm not the smartest I admit) but I don't understand why the following is happening.
Currently: When viewing on mobile, the mobile menu button has gone, the toggle switch which changed prices from monthly to annually, tabs which displayed different content has gone. As a result:
If there was a toggle, both the toggle results are displayed one above the other
If there was a tab, each tab element is displayed underneath the other
The mobile menu button has gone completely
Background:
I purchased an HTML template but it turns out the seller didn't want to help. I wanted to split and convert the page into a php page as I wanted a single header/footer file which I could import. As you will see (if you check the repo) the header.php and footer.php file is getting imported into the page php file.
I created the pages by first:
Renaming the original html file to a php file
Cut the header and footer and import them back into the page php file
That's all I have done. It seemed to work, however another check (after cache cleared) I noticed the issues.
The link to the site page im referring to is:
https://blueboxhosting.co.uk/products-cloud-hosting
But if you look at any of the pages, you'll see errors on all of them now where they're should have been controls (eg toggles, mobile menu, tabs etc)
I've created a snipped so you can view the code and HOPEFULLY spot where I've been a moron:
https://bitbucket.org/snippets/bbhostinguk/7e5qxp
Any help with this would be amazing as I just can't figure it out.
Start by running the HTML generated by PHP through a validator, e.g. https://validator.w3.org/
Your code has numerous stray tags which may or may not affect the rendering.
Another tip is to comment off everything and then uncomment section by section and check when things start to break.
I have a problem showing my page visually the same on FireFox and Chrome.
Page renders correctly with Chrome (showing icons in two lines), but in Firefox icons break visually and create a third row. I think that the problem is with Bootstrap, but I don't understand why. I have tried different solutions, but nothing.
The page with this problem:
Link of the page: http://www.unishare.it/sedi/1
You have a lot of things going on in your HTML. Firstly, you shouldn't write any code outside of the scope. You should place your custom style elements always inside of the tag. Secondly, move bootstrap.css to the top. That is your css boilerplate (That is the css code that resets your visual settings across all browsers). All the other css files (font-awesome.css, slider.css, etc...) should be placed after the boilerplate css code/file.
After placing all library css files, your custom css files should be the last ones in the tag (I mean all the style codes at the top of your html page).
Try these suggestions and come back with the result. I believe you'll be good to go then.
EDIT: After taking a second look and playing your HTML with FireFox's dev tools, I created a solution for you. Just surround your "portfolio-boxes" divs with a row. They are not actually recognized as a seperate row in your DOM, that's why they don't appear in two seperate lines.
In short, you should create a div with a class of "row" for every "portfolio-boxes" div, seperately.
Does that solve your problem? If yes, you can vote up and select the answer ;)
I'm not quite sure how to explain it but I've been searching everywhere and to no avail. Please help me here. I took CSS in college but am a bit rusty. I want to have my paleontology site so that I have the dinosaurs names on the left as a scrollable option. My old version of the site was html and it was in frames. People liked the frames cause the main page wasn't affected when they searched for the dinosaur name. In the new css the entire page moves. Also when I add a dinosaur or 3 to the list I don't want to have to add it individually to over 30 pages of dinosaurs. I want to edit one page and have it affect all of them.
I've created an independent page for the dinosaurs -> dino_list.php
But implementing it I'm not sure what to do. I'm guessing there's an "include" code for this?
Can you help me?
Here's the url: http://DinosauriaOnline.com
Thanks,
Vince
I want to have my paleontology site so that I have the dinosaurs
names on the left as a scrollable option.
To make your dinosaur list scrollable, give it an ID such as #dino-list, and then use CSS to give it a fixed height. Then set overflow: scroll on it in your CSS. That would shrink the list, cutting off some of the content, and then tell the browser that it should have a scrollbar to access the cut-off content.
#dino-list {
overflow-y: scroll;
height:200px;
}
That produces this:
Adding the fixed height is really important - otherwise the browser will assume you want to display the whole list anyway, and have a scrollbar.
Ive created an independant page for the dinosaurs -> dino_list.php But implimenting it im not sure what to do. Im guessing theres an "include" code for this?
Yup.
include "dino-list.php";
Put this where you want the list. What this does is takes dino-list.php and dumps the contents wherever you put that line. So if you have your list as HTML in dino-list.php, it'll be placed into the main code wherever you put include "dino-list.php";.
So, dino-list.php might look like this:
<ul id="dino-list">
<li>Acrocanthosaurus</li>
<li>Velociraptor</li>
</ul>
and index.php might look like this:
<div id="sidebar">
<h2>Dinosaurs</h2>
<div class="sidemenu">
<?php include "dino-list.php"; ?>
</div>
<h2>Cretacious Non Dinosaurs</h2>
<!-- rest of sidebar here -->
</div>
One thing regarding include - it literally takes everything in the source file, and dumps it into your code. If you include PHP code inside dino-list.php, it will run in your main file.
I have tried removing the title by all the methods I could find on Stackoverflow and wordpress support such as pacing a css rule and finding the get_title in the page, single and template php files. But this title doesn't seem to want to go away.
The only way I have had any success is by using a plugin that removes the title but then I am faced with the problem that the spacing remains where the title once was.
Here is a picture showing what I mean: http://i.imgur.com/vj0vbc7.jpg
Thanks in advance for your help!
You need to go into your template file and remove where the title is being outputted.
I checked the source code on your site and it looks like the theme files are not in the regular place. So do this. Go to your FTP client and open up:
/assets/956/themes/header.php
It might be named something slightly different.
Now within that theme locate your h1 tag. At this point I would recommend removing it, saving it, and making sure you have the desired change. It should be gone completely from the page. If it's not, perhaps the H1 tag is located in another file? Check other template files till you find the right one.
You can remove it all together or surround it in a div with ID='homepg-h1' Then just do a rule like this in your CSS:
#homepg-h1 {
display:none;
}
Hope that helps, let me know if you have any questions.
If you go to "Game rules" section and click around the sections "Backgammon, Narde, Nackgammon, Tavla, Old English" you will see that some sections load normally and the scrollbar works fine. Bigger sections like Backgammon and Narde do not load fully. The content in backgammon section is going out of the margin and the Narde section simply won't load fully.
What could be the issue here? All of the sections with scrollbar have the same identical settings. The only difference is that Backgammon and Narde sections have more text and more images. Could this be a reason for the glitch? Maybe the plugin somehow doesn't get to load all the content and already locks itself in place? What could be the possible solutions?
EDIT: I'm pretty sure it has something to do with tinyscrollbar plugin loading a bit too fast (before the inside content has loaded). What method could I use to put a timer on the plugin so it doesn't load as quickly or refreshes?
first it seems that your "p" elements styles do not have width set to it and when rendered they hide behind the scroll bar making some of the text not visible.
This may not answer you question directly but it may have something to do with portions of text being hidden by overflow:hidden / overflow:scroll that is being used for the scroll bar.
You could also try using the jScrollPage plug in as it simplifies the scroll bar coding.